您的位置:首页 > Web前端 > HTML5

新增的非主体结构元素

2017-12-26 15:09 239 查看
hgroup元素

<body>
<article>
<header>
<!--hgroup元素是将标题及其子标题进行分组的元素,
hgroup元素通常会将h1~h6元素进行分组,
譬如一个内容区块的标题及其子元素算一组-->
<hrroup>
<h1>
这是文章标题
</h1>
<h2>这是一个子标题</h2>
</hrroup>
<p><time datatime="2017-12-2">2017-12-2</time></p>
</header>
<div>
这是内容
</div>
<footer>
这是底部
</footer>
</article>
</body>


header元素

<body>
<!--header元素是一种具有引导和导航作用的结构元素,
通常用来放置整个页面或页面内的一个内容区块的标题,
但是也可以包含其他内容,例如数据表格、搜索表单或相关的logo图片-->
<header>
<h1>IT最新技术</h1>
<a href="#">华软</a>
<nav>
<ul>
<li><a href="#">学习</a></li>
<li><a href="#">技术</a></li>
<li><a href="#">极客</a></li>
</ul>
</nav>
</header>
<article>

</article>
</body>


footer元素

<body>
<!--footer元素可以作为其上层父级内容区块或是一个根区块的脚注。-->
<!--footer通常包括其相关区块的脚注信息,如作者、相关阅读链接及版权信息等。-->
<footer>
<ul>
<li><a href="#">版权信息</a></li>
<li><a href="#">站点地图</a></li>
<li><a href="#">联系方式</a></li>
</ul>
</footer>
</body>


address元素

<body>
<!--address元素用来在文档中呈现联系信息,包括文档作者或者文档维护者的名字、他们的网站链接、电子邮箱、真实地址、电话号码等-->
<!--address应该不只用来呈现电子邮箱或真实地址,还用来展示跟文档相关的联系人的所有联系信息-->
<address>
<a href="#">iwen</a>
<a href="">ime</a>
</address>
<footer>
<div>
<address>
<a href="#">iwen</a>
广州大学华软软件学院,信息工程
<time datatime="2017-12-2">2017-12-2</time>
</address>
</div>
</footer>
</body>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  html5