html5语义化标签,HTML5的基本结构
由于缺少结构，即使是形式良好的超文本标记语言页面也比较难以处理。必须分析标题的级别，才能看出各个部分的划分方式。边栏、页脚、页眉、导航条、主内容区和各篇文章都由通用的差异元素来表示5 .HTML 5添加了一些新元素，专门用来标识这些常见的结构：
部分：这可以是书中的一章或一节，实际上可以是在HTML 4中有自己的标题的任何东西
标题：页面上显示的页眉；与头元素不一样
页脚：页脚；可以显示电子邮件中的签名
导航：指向其他页面的一组链接
文章：博客，杂志、文章汇编等中的一篇文章
我们来考虑一个典型的博客主页，它的顶部有页眉，底部有页脚，还有几篇文章、一个导航区和一个边栏，见代码一典型的博客页面
超文本标记语言
头
titleMokka mit Schlag /title
/头
身体
div id=page
div id=header
h1a href= http://www。埃尔哈罗。com/blog mo kka MIT Schlag/a/h1
/div
div id=容器
div id=center class=column
div class= post id= post-1000572
h2a href=
/博客/观鸟/2007/04/23/苏塞克斯郡的春天来来去去/
苏塞克斯郡的春天来了又去/a/h2
div class=" entry "
昨天我加入了布鲁克林鸟类俱乐部
一年一度的新泽西西部之旅，特别是高度紧张的
腐殖质，一个相对较新发现的热点。它
我们到达时，是一个美好的冬日早晨
上午7:30在工地，进展到春天左右
上午10:00,10:15到达初夏100元/人
/div
/div
div class= post id= post-1000571
h2a href=
/博客/观鸟/2007/04/23/但是这算不算你的人生清单
但这算不算你的人生清单？/a/h2
div class=" entry "
看来你现在可以走了
href= http://www。连线。com/科学/发现/新闻/
2007/04/网络观鸟
还没能测试出来(20个用户
限制显然)但这确实很酷。
就我个人而言，我无法想象它会取代
哪怕是很小一点点。
另一方面，我一直觉得
很遗憾遇到了不再能够
拿稳望远镜或者去公园。我可以
想象一下他们可能会对此感兴趣。在
之后，至少有一个老鸟在电视上干了一年
他再也不能经常外出了。这当然
最重要的是100元/人
/div
/div
/div
div class="导航"
div class=alignleft
a href=/blog/page/2/ _ fcksavedurl= /blog/page/2/ 以前的条目/a
/div
div class=alignright/div
/div
/div
div id=right class=column
ul id=侧栏
锂信息/氢
保险商实验所
lia href=/blog/comment-policy/评论策略/a/李
lia href=/blog/Todo-List/ Todo List/a/Li
/ul/li
锂二氢存档/h2
保险商实验所
2007年四月李
2007年3月李
2007年2月李
2007年一月李
/ul
/李
/ul
/div
div id=页脚
p版权所有2007年埃利奥特拉斯蒂哈罗德/p
/div
/div
/body
/html
即使有正确的缩进，这些嵌套的差异仍然让人觉得非常混乱。在HTML 5中，可以将这些元素替换为语义性的元素，见代码2用HTML5编写的典型博客页面
超文本标记语言
头
titleMokka mit Schlag /title
/头
身体
页眉
h1a href= http://www。埃尔哈罗。com/blog mo kka MIT Schlag/a/h1
/页眉
部分
文章
h2a href=
/博客/观鸟/2007/04/23/苏塞克斯郡的春天来来去去/
苏塞克斯郡的春天来了又去/a/h2
昨天我加入了布鲁克林鸟类俱乐部
一年一度的新泽西西部之旅，特别是高度紧张的
腐殖质，一个相对较新发现的热点。它
一开始是一个美好的冬日早晨，当我们到达
上午7:30的网站，进展到春天10:00左右
上午10点，10点15分到达初夏100元/人
/文章
文章
h2a href=
/博客/观鸟/2007/04/23/但是这算不算你的人生清单
但这算不算你的人生清单？/a/h2
看来你现在可以走了
href= http://www。连线。com/科学/发现/新闻/
2007/04/网络观鸟
还没能测试出来(20个用户
限制显然)但这确实很酷。
就我个人而言，我无法想象它会取代
哪怕是很小一点点。
另一方面，我一直觉得
很遗憾遇到了不再能够
拿稳望远镜或者去公园。我可以
想象一下他们可能会对此感兴趣。在
之后，至少有一个老鸟在电视上干了一年
他再也不能经常外出了。这当然
最重要的是100元/人
/文章
航行
a href=/blog/page/2/ _ fcksavedurl= /blog/page/2/ 以前的条目/a
/导航
/部分
航行
保险商实验所
锂信息/氢
保险商实验所
lia href=/blog/comment-policy/评论策略/a/李
lia href=/blog/Todo-List/ Todo List/a/Li
/ul/li
锂二氢存档/h2
保险商实验所
2007年四月李
2007年3月李
2007年2月李
2007年一月李
/ul
/李
/ul
/导航
页脚
p版权所有2007年埃利奥特拉斯蒂哈罗德/p
/页脚
/body
/html
现在不再需要差异了。不再需要自己设置班级属性，从标准的元素名就可以推断出各个部分的意义。这对于音频浏览器、手机浏览器和其他非标准浏览器尤其重要。
（待续)
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。