回到HTML〇

HTML（HyperText Markup Language），用来向浏览器标示文档的所有“内容”与“结构”。

抱着温故而知新的态度，在这里通过“回到HTML”系列文章，重新梳理一下HTML的相关知识。

1.HTML分类

对于HTML元素有以下几种分类方法：

（1）元素类型：

1> 普通元素： <h1>元素,<p>元素...

2>void元素：<br />元素,<hr />元素..

(【注】：何为元素？这里列一个简单的公式：普通元素=开标签+内容+闭标签，void元素=开标签。普通元素之间可以按规则进行嵌套的，而void元素不可嵌套其他元素的。)

（2）样式类型：

1>块级元素：<div>元素，<table>元素...

2>内联元素：<span>元素，<a>元素...

3>内联-块级元素：<img>元素...

等等..

(【注】：浏览器默认块级元素会在显示中占满整行。)

（3）*对于HTML标签，我自己将其梳理分类为以下5个类别：

（1）结构标签：用来表示页面结构，布局，如<div>，<nav>等；

（2）排版标签：用来标注文字，进行排版，如<h1>,<time>等；

（3）组合标签：需要组合使用的标签，需要标签嵌套，又可再分为列表，表格，表单三种类型；

（4）引用标签：由于HTML文档是文本类型，因此凡是要引入文本之外类型的标签均归为此类，如链接，图像，音频，视频等；

（5）其他标签：指无法归入上述五种类别的其他标签，如：<meta>，<canvans>等。

2.HTML标签使用要求：

“用对标签，用对特性，正确嵌套。”

（1）用对标签 --> 即标签语义化：

1. 有利于SEO（搜索引擎优化）
2. 有利于屏幕阅读器阅读（无障碍性）
3. 容易修改和维护代码
4. 手机显示时会有针对性的渲染

（2）用对特性：

特性：元素开标签特有属性，用以进一步描述标签含义，例如<a href="www.google.com">to google</a>，这里href特性说明了链接的跳转方向。一些特性是每个元素都可以使用的，如id特性，而另一些则只有特定元素可以使用，如何使用好特性丰富标签含义，也是我们关注的重点。

（3）正确嵌套：

例如<p>标签不可以被<a>标签嵌套，熟悉标签嵌套规则，有利于写出规范的HTML代码。