# HTML5元素背景知识

# 语义与呈现分离

HTML5中的一大主要变化是信念方面的:将元素的语义与元素对其内容呈现结果的影响分开。 HTML元素负责文档内容结构和含义,呈现则由CSS来控制。

HTML5新增的大多数元素都有具体的含义:如 article 用来表示独立成篇的内容,而figure元素表示图片。

HTML4中的许多元素产生在呈现与含义分离观念形成之前。比如之前定义的 b 元素,没有任何语义,只是用来表示粗体,HTML5不再提倡纯属呈现因素的元素,所以对b元素下了新的定义:将文字从周围文字中凸现出来并不表示特别的强调或重要性。

# 元素选用原则

# 少亦是多

元素标记只应该在语义需要时才使用,不要乱用。使用一个元素之前,想想是否可以发挥这个元素的语义作用

# 别误用元素

对内容进行标记时,内容要与元素的语义对应,不要创建自有的语义。如果找不到合适的元素来标记内容,可以使用span或div,再用class属性表明其含义。

# 具体为佳,一以贯之

用来标记内容的元素应该选择最为具体的那个。如果已有元素能恰当表明内容的类型,就不要使用通用元素。

# 呈现与语义分离的目的

从用户看到的显示效果来说,就算不遵守元素选用规则,也不影响显示效果。但为什么要遵循这么严格的元素选用规则呢? 呈现与语义分离原则的目的完全是为了让HTML更易于程序化处理。如果不遵循一定的规则,这样HTML文档处理起来会更加困难。

# 元素说明示例

3_0_元素说明示例.png

# 元素速览

# 1.文档和元数据(创建HTML文档)

3_2_文档和元素数据元素.png

# 2.文本元素(标记文字)

3_3_文本元素.png

# 3.对内容分组(组织内容)

3_4_用于分组的元素.png

# 4.划分内容(文档分节)

3_5_用户划分内容的元素.png

# 5.制表(表格元素)

3_6_表格元素.png

# 6.创建表单(表单元素)

3_7_表单元素.png

# 7.嵌入内容

3_8_嵌入元素.png

上次更新: 2021/3/7 11:49:01