语义化标签
在H5之前,我们使用的div标签可以划分网页结构但是都没有实际意义。我们都是配合css样式的id与class选择器来形容这块内容的意义,语义化标签可与div一起使用,语义化标签见其名可知意,不用起名字建议多使用。
section元素
表示页面中的一个区块,可划分网页上下板块
article元素
表示一块与上下文无关的独立的内容
aside元素
在article之外的,与article内容相关的辅助信息
header元素
表示页面中一个内容区块或整个页面的标题
footer元素
表示页面中一个内容区块或整个页面的脚注
nav元素
表示页面中导航链接部分
figure元素
表示一段独立的内容,使用figcaption元素为其添加标题(第一个或最后一个子元素的位置)
main元素
表示页面中的主要的内容(ie不兼容)
hgroup元素
标题的一个分组
mark元素
定义高亮显示的文本(span)
time元素
出现时间都可使用
dialog元素
标记定义一个对话框(会话框)类似微信
embed元素
标记定义外部的可交互的内容或插件 比如flash
搭建网页结构
使用新标签可搭建网页结构,如下图
html代码如下
<body>
<div class="box">
<header>header</header>
<section>
<nav>
nav
</nav>
<main>
<article>
<header>article header</header>
<p>嘿嘿嘿嘿嘿嘿嘿嘿嘿嘿嘿嘿嘿嘿嘿嘿嘿嘿嘿嘿嘿嘿嘿嘿嘿嘿嘿嘿嘿嘿嘿嘿嘿嘿嘿嘿嘿嘿嘿嘿嘿嘿嘿嘿嘿