一、HTML元素的语义分类1.结构语义元素div 语义：Division（分隔）。

在文档中定义一块区域，即包含框，IE认为它是一个容器span 语义：Span（范围）。

在文本行中定义一个区域，即包含框ol 语义：Ordered List（排序列表）。

根据一定的排序进行列表ul 语义：Unordered List（不排序列表）。

没有排序的列表li 语义：List Item（列表项目）。

每条列表项dl 语义：Definition List（定义列表）。

以定义的方式进行列表dt 语义：Definition Term（定义术语）。

定义列表中的词条dd 语义：Definition Description（定义描述）。

对定义的词条进行解释del 语义：Deleted Text（删除的文本）。

定义删除的文本ins 语义：Inserted Text（插入的文本）。

定义插入的文本h1~.h6 语义：Header 1 to Header 6（标题1到标题6）。

定义不同级别的标题p 语义：Paragraph（段落）。

定义段落结构hr 语义：Horizontal Rule（水平尺）。

定义水平线2.内容语义元素a 语义：Anchor（定义锚）。

锚即定位的意思，换句话说就是超链接，即在多页间定位abbr 语义：Abbreviation（缩写词）。

定义缩写词acronym 语义：Acronym（取首字母的缩写词）。

定义取首字母的缩写词address 语义：Address（地址）。

定义地址dfn 语义：Defines a Definition Term（定义定义条目）kbd 语义：Keyboard Text（键盘文本）。

定义键盘键samp 语义：Sample（示例）。

定义样本var 语义：Variable（变量）。

定义变量tt 语义：Teletype Text（打印机文本）。

定义打印机字体code 语义：Code Text（源代码）。

定义计算机源代码pre 语义：Preformatted Text（预定义格式文本）。

定义预定义格式文本，保留源代码格式blockquote 语义：Block Quotation（区块引用语）。

定义大块内容引用cite 语义：Citation（引用）。

定义引文q 语义：Quotation（引用语）。

引用短语strong 语义：Strong Text（加重文本）。

定义重要文本em 语义：Emphasized Text（加重文本）。

定义文本为重要3.修饰语义元素b 语义：Bold Text（粗体文本）。

定义粗体i 语义：Italic Text（斜体文本）。

定义斜体big 语义：Big Text（大文本）。

定义文本增大small 语义：Small Text（小文本）。

定义文本变小sup 语义：Superscripted Text（上标文本）。

定义文本上标sub 语义：Subscripted Text（下标文本）。

定义文本下标bdo 语义：Direction of Text Display（文本显示方向）。

定义文本显示方向br 语义：Break（换行）。

定义换行center 语义：Centered Text（居中文本）。

定义文本居中font 语义：Font（字体）。

定义文字的样式、大小和颜色u 语义：Underlined Text（下划线文本）。

定义文本下划线s 语义：Strikethrough Text（删除文本线）。

定义删除线strike 语义：Strikethrough Text（删除文本线）。

定义删除线二、HTML属性的语义分类1.核心语义属性class 语义：Class（类）。

定义类规则或样式规则id 语义：IDentity（身份）。

定义元素的唯一标识style 语义：Style（样式）。

定义元素的样式声明但是下面这些元素不拥有核心语义属性：html、head 文档和头部基本结构title 网页标题base 网页基准信息meta 网页元信息param 元素参数信息script、style 网页的脚本和样式2.语言语义属性lang 语义：Language（语言）。

定义元素的语言代码或编码dir 语义：Direction（方向）。

定义文本的方向，包括ltr和rtl取值，分别表示从左向右和从右向左下面这些元素不拥有语言语义属性：frameset、frame、iframe 网页框架结构br 换行标识hr 结构装饰线base 网页基准信息param 元素参数信息script 网页的脚本3.键盘语义属性Accesskey 语义：Access Key（访问键）。

定义访问某元素的键盘快捷键tabindex 语义：Tab Index（Tab键索引）。

定义元素的Tab键索引编号使用accesskey属性可以使用快捷键（Alt+字母）访问指定URL，但是浏览器支持不是很好，在IE中仅激活超链接，需要配合Enter键确定，而在FF中没有反应。

例如：<a href="/" accesskey="a">按住Alt键，单击A键可以链接到样吧首页</a>4.内容语义属性alt 语义：Alternate Text（替换文本）。

定义元素的替换文本title 语义：Title（标题）。

定义元素的提示文本longdesc 语义：Long Describe（长文描述）。

定义元素包含内容的大段描述信息cite 语义：Cite（引用）。

定义元素包含内容的引用信息datetime 语义：Date and Time（日期和时间）。

定义元素包含内容的日期和时间5.其他语义属性rel 语义：Relationship（关联）。

定义当前页面与其他页面的关系rev 语义：Reverse Link（反向链接）。

定义其他页面与当前页面之间的链接关系提及rel属性，很多人把它当作target 的替代属性。

实际上，它们是不同性质的属性，rel和rev属性相对应，它们的语义比较如下：rel表示从源文档到目标文档的关系。

rev表示从目标文档到源文档的关系。

三、列表信息的语义结构1.认识列表结构ul 无序列表ol 有序列表li 列表项目dl 定义列表dt 定义列表标题dd 定义列表说明menu 菜单列表dir 目录列表2.使用普通列表结构普通列表元素包括ul、ol和li。

从语义角度来分析，实际上ul和ol没有什么区别，只不过是形式不同罢了，即项目符号的显示效果不同而已。

如果使用CSS你完全把它们混用。

ul是Unordered List短语的缩写，可以翻译为不排序列表。

从形式上看，也就是项目符号不是有序符号，如1、2、3等。

ol是Ordered List短语的缩写，可以翻译为排序列表。

li是List Item短语的缩写，表示列表项，该元素必须包含在ul、ol元素中。

3.使用定义列表结构有序列表（ol和li）、无序列表（ul和li）的父子搭配结构不同，定义列表包含了3个元素：dl、dt和dd。

这也为设计师构建复杂的信息结构提供了想像的空间。

如果随意浏览一下国外的专业站点，你都会发现很多配合使用这三个元素的精巧结构。

dl是Definition List短语的缩写，直译为定义列表，相当于列表包含框；dt是Definition Term短语的缩写，直译为定义条目，相当于词典中被解释的词汇；dd是Definition Description短语的缩写，直译为定义描述，它相当于词典中解释内容。

4.使用定义列表的误区误用一，把定义列表看作是栏目的模板结构。

也就是说，在定义列表中一个dt元素下面跟随这个多个dd元素。

<h2>误用一：一个dt和多个dd</h2><dl><dt>栏目标题</dt><dd>项目1</dd><dd>项目2</dd><dd>项目3</dd><dd>项目4</dd></dl>误用二，缺失dt或dd元素。

也就是说把定义列表当作普通列表来使用。

<h2>误用二：dt或dd缺失</h2><dl><dd>项目1</dd><dd>项目2</dd><dd>项目3</dd><dd>项目4</dd></dl>四、数据表格的语义化结构1.认识数据表的结构table 语义：Table（表）tr 语义：Table Row（表格行）td 语义：Table Data Cell（表格数据单元）2.使用表格元素th 语义：Table Header（表头）。

列标题元素caption 语义：Table Caption（表格标题）。

数据表格的标题元素summary 语义：Table Summary（表格摘要）。

table元素的属性，定义数据表格的摘要3.数据分组thead 语义：Table Header（表格头）。

在数据表中定义头部区域tbody 语义：Table Body（表格主体）。

在数据表中定义主体区域tfoot 语义：Table Footer（表格脚）。

在数据表中定义脚部区域数据列分组col 语义：Table Columns（表格列）。

在数据表中定义列区域colgroup 语义：Groups of Table Columns（数据列组）。

在数据表中定义数据列组五、表单的语义化基本结构1.认识表单的结构一个功能完整的表单块应该包含三部分结构：包含框、输入框和提交按钮。

例如，在上面示例代码的基础上，我们完善这个表单结构：<form id="form1" name="form1" method="post" action=""> <!-- 表单包含框 --> <input type="text" name="textfield" id="textfield" /> <!-- 输入框 --> <input type="submit" name="button" id="button" value="提交" /><!-- 提交按钮 --></form>2.认识表单元素form 语义：Form（形状）。