html5新增的布局标签

article 表示一篇任何形式的文章。即新闻报道、论坛帖子或博客文章(标题、时间、作者等与文章息息相关的信息)

aside 独立于页面主体的一个完整的内容块。例如,附注栏,其中包含与主体文章相关的内容或链接

figure、figcaption 表示一幅插图。figcaption为标注图题,figure标注figcaption和插入图片的img。图片和图题是关联的

footer 表示页面底部的页脚。html5规范规定,只能包括版权声明、简单的链接等。当页脚很庞大时,应该用div之类的元素包含,然后footer只包含一段版权

header 增强类标题,可以包含HTML标题和其他内容。其他内容是标志、作者署名等一块标题信息。此标签比footer的使用范围更广

nav 表示页面中重要的一组链接。通常只有一个,不过也可以包含多个nav

section 表示文档中的一个区块,或者一组文档。其内容开始于一个标题,在article和aside不适用的时候使用

main 表示页面中的主题。一个页面只有一个,通常用来包含article,隔离页眉、页脚和侧边栏

时间: 2024-11-24 05:58:36

html5新增的布局标签的相关文章

《html5新增及删除标签》

html5新增及删除标签 原文:http://www.cnblogs.com/starof/archive/2015/06/23/4581850.html 一.新增标签 有一种划分为,功能性标签[html5新增,如canvas,旧浏览器没有]和语义性标签[如header等只是增强语义,没有新功能].下面按照分几个小类来说. 1.结构标签 新增的结构标签,之前都是用div实现的,为了语义化,html5从div派生出很多新的标签.这些新增的结构标签有助于将文档分成几个逻辑部分.如下: a.secti

浅谈html语义化标签,Html5新增语义化标签

Html语义化标签,Html5新增语义化标签 自己在学习的期间,整理了下html关于语义化标签的一些知识,列的不是很全. 希望大家有新的见解可以给我留言,我会补充上去,谢谢大家 1.什么是语义化标签? 那么什么叫做语义化呢,说的通俗点就是:明白每个标签的用途(在什么情况下我可以使用这个标签才合理)比如, 网页上的文章的标题就可以用标题标签,网页上的各个栏目的栏目名称也可以使用标题标签. 文章中内容的段落就得放在段落标签中,在文章中有想强调的文本,就可以使用em标签表示强调等等. 2.为啥使用语义

html5新增及删除标签

一.新增标签 有一种划分为,功能性标签[html5新增,如canvas,旧浏览器没有]和语义性标签[如header等只是增强语义,没有新功能].下面按照分几个小类来说. 1.结构标签 新增的结构标签,之前都是用div实现的,为了语义化,html5从div派生出很多新的标签.这些新增的结构标签有助于将文档分成几个逻辑部分.如下: a.section标签 表示页面中的一个独立内容区块,里面有自己的大纲结构,比如章节,页眉,页脚或页面的其他部分.就是说section可以包含h1.h2...h6标签,表

HTML5新增的语义标签和IE版本低的兼容性问题

<!DOCTYPE html><html> <head> <!-- HTML5中浏览器兼容(较低版本的IE浏览器不支持H5的布局):需要在<head>中加入 <!-[if lt IE9]><script src="html5.js"></script><![endif]->(html5.js是外部引入文件), 在head中的<style></style>中加入s

HTML5新增的音频标签、视频标签

我们所说的H5就是我们所说的HTML5中新增的语言标准 一.音频标签 在HTML5当中有一个叫做audio的标签,可以直接引入一段音频资源放到我们的网页当中 格式: <audio autoplay controls loop > 降级的文字说明(当音频文件不能本浏览器解析时显示此文字) <source src="格式1路径" > <source src="格式1路径" > ........... </ audio> a

HTML5新增元素、标签总结

总是遇到h5新标签的笔试题目,就查阅了资料来总结一下: 1.form相关: (1)form属性:在HTML5中表单元素可放在表单之外,通过给该元素添加form属性来指向目标表单(form属性值设为目标表单id)即可. (2)formaction属性:HTML5给提交按钮(如button.submit.image等)增加了formaction属性,以便提交到不同的服务器地址. <input formaction="new.html" type="submit"

html5新增语义化标签

注意:body.section.nav 需要h1-h6. div.header则不需要. 1):<article> 显示一个独立的文章内容. 例如一篇完整的论坛帖子,一则网站新闻,一篇博客文章等等,一个用户评论等等.artilce可以嵌套,则内层的artilce对外层的article标签有隶属的关系. 例如,一个博客文章,可以用article显示,然后一 些评论可以以article的形式嵌入其中. <article> <h1>文章标题</h1> 这是一篇文章

HTML5新增标签总结和说明

HTML5出来这么久,都没有真正的理解和花时间去看,经常看到一些网页的里面包含很多陌生的标签元素,一直不清楚是什么功能.像<article>.<aside>. 其实这两个标签和<div>的功能一样仅仅是一个块级元素没有任何的样式和功能事件上的特点完全可以理解为div,.但是HTML5为什么要增加这些看似"毫无作用"标签呢.        我们知道经这么长时间的发展,HTML5的应用已经普及了.从使用的特点上来看,HTML5相对以前版本来看给人的感觉就

HTML5新增Canvas标签及对应属性、API详解(基础一)

知识说明: HTML5新增的canvas标签,通过创建画布,在画布上创建任何想要的形状,下面将canvas的API以及属性做一个整理,并且附上时钟的示例,便于后期复习学习!Fighting! 一.标签原型 <canvas width=”1000” height=”1000” id=”myCanvas”> 您的浏览器版本过低,不支持HTML5新增的canvas标签. </canvas> 使用js获取该画布,并指定对象 <script> Var canvasID = doc