跟永哥学HTML5(3):HTML5新增语义化元素的使用

5.<aside>元素

用来表示非正文类的内容(当前页面或文章的附属信息)。如相关的引用、侧边栏、广告、侧边栏等信息。 【例5】应用<aside>元素定义页面侧栏。

<aside> 
<h2>侧栏</h2>
<ul>
    <li><a href="http://www.min.com">明日图书</a> </li>
    <li><a href="http://www.%20risoft.com">明日软件</a></li>
  ……
</ul>
</aside>

6.<nav>元素

来表示页面中导航链接区域。不是链接的每一个集合都是一个nav,只需要将主要的、基本的链接组放进nav元素即可 例如,在页脚中通常会有一组链接,包括服务条款、版权声明、联系方式等。对于这些footer元素就足够放置了。一个页面中可以拥有多个nav元素,作为页面整体或不同部分的导航。 【例6】应用<nav>元素定义页面的主导航栏。

<nav>
  <ul>
    <li><a href="#">首页</a></li>
    <li><a href="#">新品上市</a></li>
    <li><a href="#">特价商品</a></li>
    ……
  </ul>
</nav>

7.hgroup :用于对网页或区段的标题元素(h1-h6)进行组合。

如在一个区段中你有连续的h标签元素,则可以用hgroup将他们括起来。 

示列 :

<hgroup>
   <h1>125建站网</h1>
   <h2>提供丰富的网页设计、网页制作教程</h2>
 </hgroup>

8.figure:规定独立的流内容(图像、图表、照片、代码等等)。

figure 元素的内容应该与主内容相关,但如果被删除,则不应对文档流产生影响。 

示列 :

<p>网页设计问答社区</p>
<figure> <img src="125jz.png" width="350" height="234" /> </figure>

童鞋们,今天的课程就这么多了,好好理解。下节课我们通过实际案例讲解HTML5页面的制作。

125jz网原创文章。发布者:江山如画,转载请注明出处:http://www.125jz.com/738.html

(0)
江山如画的头像江山如画管理团队
上一篇 2018年1月24日 下午1:32
下一篇 2018年1月27日 下午9:18

99%的人还看了以下文章

发表回复

登录后才能评论

评论列表(1条)

  • 江山如画的头像
    江山如画 2018年2月3日 上午9:56

    在HTML5中,script和style元素不再需要type属性。
    <link type="text/css" rel="stylesheet" href="css/styles.css" />
    <script type="text/javascript" src="js/scripts" /></script>

    只需要这样写:
    <link rel="stylesheet" href="css/styles.css" />
    <script src="js/scripts" /></script>