你的位置:首页 > 软件开发 > 网页设计 > html5学习笔记(1)

html5学习笔记(1)

发布时间:2015-12-17 15:00:09
最近在做的项目中用到了Html5的部分标签,经师父提醒感觉自己用section的次数多的有点过分,今天去找了一篇HTML5新标签的使用方法,特意贴了上来,感谢原作者的分享,方便以后自己使用~~~ HTML5时代的召唤  上一代的HTML的标准: HTML 4.01 ...

html5学习笔记(1)

最近在做的项目中用到了Html5的部分标签,经师父提醒感觉自己用section的次数多的有点过分,今天去找了一篇HTML5新标签的使用方法,特意贴了上来,感谢原作者的分享,方便以后自己使用~~~

 

HTML5时代的召唤

<body> <header>...</header> <nav>...</nav> <article>  <section>   ...  </section> </article> <aside>...</aside> <footer>...</footer></body>
html5学习笔记(1)

 

有了上面的直接的感官的认识后,我们下面一一来介绍HTML5中的相关结构标签。

 

section标签

<section>标签,定义文档中的节。比如章节、页眉、页脚或文档中的其它部分。一般用于成节的内容,会在文档流中开始一个新的节。它用来表现普通的文档内容或应用区块,通常由内容及其标题组成。但section元素标签并非一个普通的容器元素,它表示一段专题性的内容,一般会带有标题

<section><h1>section是什么?</h1><h2>一个新的章节</h2><article><h2>关于section</h1><p>section的介绍</p>...</article></section>
html5学习笔记(1)

 

article标签

<article>是一个特殊的section标签,它比section具有更明确的语义,它代表一个独立的、完整的相关内容块,可独立于页面其它内容使用。例如一篇完整的论坛帖子,一篇博客文章,一个用户评论等等。一般来说,article会有标题部分(通常包含在header内),有时也会包含footer。article可以嵌套,内层的article对外层的article标签有隶属关系。例如,一篇博客的文章,可以用article显示,然后一些评论可以以article的形式嵌入其中。

html5学习笔记(1)
<nav><ul><li>厚德IT</li><li>FlyDragon</li><li>J飞龙天惊</li></ul></nav>
html5学习笔记(1)

 

aside标签

aside标签用来装载非正文的内容,被视为页面里面一个单独的部分。它包含的内容与页面的主要内容是分开的,可以被删除,而不会影响到网页的内容、章节或是页面所要传达的信息。例如广告,成组的链接,侧边栏等等。

html5学习笔记(1)
<header><hgroup><h1>网站标题</h1><h1>网站副标题</h1></hgroup></header>
html5学习笔记(1)

 

footer标签

footer标签定义section或document的页脚,包含了与页面、文章或是部分内容有关的信息,比如说文章的作者或者日期。作为页面的页脚时,一般包含了版权、相关文件和链接。它和<header>标签使用基本一样,可以在一个页面中多次使用,如果在一个区段的后面加入footer,那么它就相当于该区段的页脚了。

<footer>COPYRIGHT@厚德IT</footer>
<hgroup><h1>这是一篇介绍HTML 5结构标签的文章</h1><h2>HTML 5的革新</h2></hgroup>
html5学习笔记(1)

 

figure 标签

用于对元素进行组合。多用于图片与图片描述组合。

html5学习笔记(1)

原标题:html5学习笔记(1)

关键词:HTML

*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们: admin#shaoqun.com (#换成@)。