1、文本修饰标签
1.1、<h1>到<h6>标签
<h1>到<h6>标签是指标题标签,<h1>是标题一标签,<h6>是标题六标签,<h1>的字体最大最粗,到<h6>的字体就是最小最细,其他的以此类推。
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<h1>h1标签</h1>
<h2>h2标签</h2>
<h3>h3标签</h3>
<h4>h4标签</h4>
<h5>h5标签</h5>
<h6>h6标签</h6>
</body>
</html>
1.2、<b>与<strong>标签
<b>是定义显示的文字为粗体,<strong>是强调文本,虽然他们看上去都是显示字体变粗,但是如果你想强调某个文本的话,建议使用<strong>
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<b>在这里使用的是加粗标签</b>
<strong>在这里使用的是强调标签</strong>
</body>
</html>
1.3、 <i>与<em>标签
<i>是定义显示的文字为斜体,<em>是强调文本,虽然他们看上去都是显示字体斜体,但是如果你想强调某个文本的话,建议使用<strong>
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<i>在这里使用的是斜体标签</i>
<br>
<em>在这里使用的是斜体强调标签</em>
</body>
</html>
1.4、<s>与<del>标签
<s>标签是定义加删除线的文本,<del>标签是定义被删除的文本,其实都是起到了删除线的作用,用哪个都可以,但是W3C不建议是用<s>,所以需要删除线的话就使用<del>吧
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<s>这是被定义为加删除线的文本标签</s>
<br>
<del>这是被定义为被删除的文本标签</del>
</body>
</html>
2、标签的属性与嵌套
2.1、标签属性的书写
以下是标签属性的书写格式,每种标签都有不同的属性,具体标签对应什么属性需要自己去查询了
下面是html中标签属性的编写
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<h1>万维网</h1>
<h6><font color="blue" size="6">w3c</font>就是指的万维网</h6>
</body>
</html>
2.2、标签属性的嵌套
正如刚才所说,不是所有的标签都具有相同的属性,所以有时候需要进行属性的嵌套使用,已达到我们预期的效果,下面是嵌套属性的写法,在标签属性当中再嵌套标签属性,需要像下面这样编写,提现层级关系
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<h2 align="center">
<font color="red" size="6">
<em>
在这里使用了标签属性的嵌套方法,这样写能够理清层级关系
</em>
</font>
</h2>
</body>
</html>
2.3、标题的修改
需要设置标题的话,只需要修改标签<title>即可
<!DOCTYPE html>
<html>
<head>
<title>HTML练习</title>
</head>
<body>
<h2 align="center">
<font color="red" size="6">
<em>
修改标题,直接修改title标签即可
</em>
</font>
</h2>
</body>
</html>
3、其他属性标签
3.1、区块标签
以下是常用的区块标签
<p>...</p>:段落标签,p标签属性段落文本标签,文章的分段都是用p标签,段落之间会有间隔
<div>...</div>:区块布局标签,div就是一个布局的容器
<span>...</span>:区块布局标签,是无样式的区块标签
3.2、单标签及其属性
以下是常用的单标签
<hr/>:水平线标签
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<p>这是水平线标签</p>
<hr/>
</body>
</html>
以下配置了水平线的属性
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<p>这是水平线标签</p>
<hr width="500" align="left" color="red" />
</body>
</html>
<br/>:换行符标签
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<span>使用换行符</span><br/>
<span>使用换行符</span><br/>
<span>使用换行符</span><br/>
<span>使用换行符</span><br/>
</body>
</html>
<pre>...</pre>:格式化标签,将源码中的样式展示出来
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<pre>
你
好
啊
!
</pre>
</body>
</html>
3.3、HTML字符实体
在HTML当中如果我们想展示空格等字符实体时,在html文件中输入空格等字符实体,html是不能识别的,所以需要输入相应的字符来对应字符实体,下面就是HTML代码对应的字符实体
显示结果 | 描述 | 实体名称 |
空格 | | |
< | 小于号 | < |
> | 大于号 | > |
& | 和号 | & |
'' | 引号 | " |
§ | 小节 | § |
© | 版权 | © |
® | 注册商标 | ® |
x | 乘号 | × |
÷ | 除号 | ÷ |