HTML笔记1(初级)
文本元素
h元素
h1至h6:一到六级标题
标题
p元素
p元素是段落元素,表示段落,即pargraphs
段落的内容
在一些测试界面中需要批量生成一些单词,则可以使用loren来生成一定数量的乱数假文。
乱数假文,没有实际含义的文字
例,输入lorem1000则是批量生成1000个乱数假文
span元素【无语意】
span的用法,没有语义没有设计样式,并且在显示中不会独占一行,主要用来套用目标。
套用的目标
pre预格式化文本元素
在一般的html语言标记中,都会产生空白折叠,所以想要实现一些特定的画面需要用到pre元素。该元素通常用于网页中显示一些代码。pre元素功能的本质是它拥有一个默认的css属性。
空白折叠:在源代码中的连续空白字符(空格、换行、指表),在页面显示时,会被折叠为一个空格。
例外:在pre元素中的内容不会出现空白折叠,在pre元素内部出现的内容会按照源代码格式出现到页面上。
vari=2;
if(i){
console.log(i);
}
code元素
code元素用于表示代码区域
代码片段
HTML实体(实体字符),HTMLEntity
实体字符通常用于页面中显示一些特殊符号。比如如果想要在网页页面中显示
>符号,那么在编写源代码的时候会报错,因为>默认是代码元素的外框,如果想要在网页界面中显示这些符号,则需要用到实体字符。实体字符主要有下面的两种写法
&单词;
数字;
这两种都能在页面中表示一些特殊符号
这里只举一些常用的例子,毕竟实体字符太多了,不可能一一举例
小于符号<;
大于符号>;
空格符号 ;
版权符号©;
&符号&;
a元素(超链接)
href属性
普通链接的写法
运用链接的文字
baidu
跳转某个锚点(锚链接的写法)
锚链接的意义在于可以从当前页面中的一个位置跳转到当前页面的另一个位置,这里需要用到id属性,具体写法如下:
先将需要跳转到的位置加一个id属性,并给该属性命名(起一个独一无二的名字),然后在a元素中加入#属性名
id属性:全局属性,表示元素在文档中的唯一编号
例
点击跳转到章节1
章节1
章节1段落
注:当中的chapter是自定义的一个属性名称,最好使用英文
在锚链接的使用中,还有一些特殊的写法,如下面这种锚链接,它会返回到页面的顶端
返回顶面
如果需要从一个节面跳转到另一个页面的锚链接上面,则这样写:
跳转到锚链接的第三章
功能链接:点击后,触发某个功能
点击后触发JS代码,javascript:例:
弹出你好
发送邮件,mailto:例:
点击给我发送邮件
拨号,tel:例:
给我打电话
target属性
target属性表示跳转窗口的位置
target的取值:
_self:在当前页面窗口中打开,这个是默认值
baidu
_blank:在新窗口中打开
baidu
title:全局属性,鼠标放上去的时候,显示输入的内容
你好啊
路径的写法
在学路径的写法之前一定要认清需要写的是站内资源还是站外资源
站内资源:当前网站的资源
站外资源:非当前网站的资源
站外资源:只能使用绝对路径
站内资源:最好使用相对路径,也可以使用绝对路径
绝对路径
绝对路径的书写格式:
url地址:
协议名://主机名:端口号/路径
schema://host:port/path
https://www.baidu.com/newspage/data
协议名:http、https、file
主机名:域名、IP地址
端口号:如果协议是http协议,默认端口号80;如果协议是https协议,默认端口号为443
当跳转目标和当前页面的协议相同时,可以省略协议
相对路径
以./开头,./表示当前资源所在的目录
可以书写…/表示返回上一级目录
相对路径中:./可以省略
点击进入下一篇:HTML5学习2(初级)
作者:沙场烽火侵胡月