html5新特性-header,nav,footer,aside,article,section等各元素的详解
Html5新增了27个元素,废弃了16个元素,根据现有的标准规范,把HTML5的元素按优先级定义为结构性属性、级块性元素、行内语义性元素和交互性元素四大类。
下面是对各标签的详解,section、header、footer、nav、article、aside、figure、code、dialog、meter、
time、progress、video、audio、details、atagrid、menu、command的 介绍
结构性元素主要负责web上下文结构的定义
section:在 web 页面应用中,该元素也可以用于区域的章节描述。
header:页面主体上的头部, header 元素往往在一对 body 元素中。
footer:页面的底部(页脚),通常会标出网站的相关信息。
nav:专门用于菜单导航、链接导航的元素,是 navigator 的缩写。
article:用于表现一篇文章的主体内容,一般为文字集中显示的区域。
级块性元素主要完成web页面区域的划分,确保内容的有效分割。
aside:用于表达注记、贴士、侧栏、摘要、插入的引用等作为补充主体的内容。
figure:是对多个元素进行组合并展示的元素,通常与 ficaption 联合使用。
code:表示一段代码块。
dialog:用于表达人与人之间的对话,该元素包含 dt 和 dd 这两个组合元素, dt 用于表示说话者,而 dd 用来表示说话内容。
行内语义性元素主要完成web页面具体内容的引用和描述,是丰富内容展示的基础。
meter:表示特定范围内的数值,可用于工资、数量、百分比等。
time:表示时间值。
progress:用来表示进度条,可通过对其 max 、 min 、 step 等属性进行控制,完成对进度的表示和监事。
video:视频元素,用于支持和实现视频文件的直接播放,支持缓冲预载和多种视频媒体格式。
audio:音频元素,用于支持和实现音频文件的直接播放,支持缓冲预载和多种音频媒体格式。
交互性元素主要用于功能性的内容表达,会有一定的内容和数据的关联,是各种事件的基础。
details:用来表示一段具体的内容,但是内容默认可能不显示,通过某种手段(如单击)与 legend 交互才会显示出来。
datagrid:用来控制客户端数据与显示,可以由动态脚本及时更新。
menu:主要用于交互菜单(曾被废弃又被重新启用的元素)。
command:用来处理命令按钮。
如果对您有帮助,请点击支持~
html5新特性-header,nav,footer,aside,article,section等各元素的详解的更多相关文章
- HTML5新特性:范围样式
原文出处:http://blog.csdn.net/hfahe/article/details/7381141 Chromium 最近实现了一个HTML5的新特性:范围样式,又叫做< ...
- html5新特性
这一篇博文不会告诉你怎么去使用html5的新特性,只会给你总结一下新特性------对于好学的人可以把这篇文章当做一个目录 对于初接触的人来说是一个导向 对于已经接触过的人来说是一个检测你掌握程度的检 ...
- HTML5新特性之CSS+HTML5实例
1.新的DOCTYPE和字符集 HTML5的一项准则就是化繁为简,Web页面的DOCTYPE被极大的简化. <!DOCTYPE html> 同时字符集声明也被简化了: <meta c ...
- 第二季第八天 HTML5新特性
在函数内部window.a = a 在全局中就可以拿到这个变量 变量命名.作为函数的参数的时候要详细.调用的时候可以简单点 做全局变量的两个方案 1.绑在标签上data 2.闭包 视频一般都是二进 ...
- 前端进阶系列(三):HTML5新特性
HTML5 是对 HTML 标准的第五次修订.其主要的目标是将互联网语义化,以便更好地被人类和机器阅读,并同时提供更好地支持各种媒体的嵌入.HTML5 的语法是向后兼容的.现在国内普遍说的 H5 是包 ...
- 关于自我总结的html5新特性
最近本包子制订了一个学校计划,第一步就是了解并总结一下html5现在所含有的新特性,好吧,这只是一个了解,- -! 自己总结了一个word文档,里面很多东西自己都还没实际用过,下一步,本包子要写pc端 ...
- html5新特性与用法大全了解一下
有好多小伙伴私聊我问我html5新特性 和用法,下面我给大家具体介绍一下html5都新加了哪些新特性,下面我给大家总结一下. 1)新的语义标签 footer header 等等2)增强型表单 表单2. ...
- 转: HTML5新特性之Mutation Observer
转: HTML5新特性之Mutation Observer Mutation Observer是什么 Mutation Observer(变动观察器)是监视DOM变动的接口.当DOM对象树发生任何变动 ...
- HTML5新特性:FileReader 和 FormData
连接在这里: HTML5新特性:FileReader 和 FormData
随机推荐
- 使用cmd打开磁盘目录和文件
例如: 1.进入e盘 2.查看E盘下所有文件 3.进入指定文件夹
- [Usaco2007 Open]Fliptile 翻格子游戏题解
问题 B: [Usaco2007 Open]Fliptile 翻格子游戏 时间限制: 5 Sec 内存限制: 128 MB 题目描述 Farmer John knows that an intell ...
- Bzoj 3874: [Ahoi2014&Jsoi2014]宅男计划 三分+贪心
3874: [Ahoi2014&Jsoi2014]宅男计划 Time Limit: 1 Sec Memory Limit: 256 MBSubmit: 861 Solved: 336[Su ...
- 9.16考试 第一题 X国的军队题解
这道题总体来看还是比较满意的.连想带打不超过半个小时,打了不到当时基本读懂后就感觉是贪心,但贪什么很重要,当时一开始想的是贪心死亡人数,从小到大搞,然后自己造了几个小数据,还好WA了,然后又列了一个式 ...
- samrt210开发板ping-系列问题(开发板ping通主机,主机ping通虚拟机,唯独~开发板ping不通虚拟机)
硬件:PC机.虚拟机(Linux).开发板(smart210) 常用模型: 注:1).有线网卡与无线网不可同连一个路由器,不可在同网段: 2).vmware选择桥接模式,虚拟网络适配器选定具体的网卡名 ...
- 编译AMQP-CPP
1 cd ./AMQP-CPP/examples/boost$ 2.cmake . 提示boost版本太低, 首先要编译生成boost安装工具bjam进入boost目录执行:./bootstrap. ...
- c语言进阶10-算法
一. 数据结构和算法关系 为什么要学数据结构和算法? 通常,计算机解决问题的步骤如下: 在数学模型中,计算机处理的对象之间通常存在着一种最简单的线性关系,这类数学模型就是线性的数据结构.著名计算机科 ...
- Python常用的标准库以及第三方库
Python常用的标准库以及第三方库有哪些? 20个必不可少的Python库也是基本的第三方库 读者您好.今天我将介绍20个属于我常用工具的Python库,我相信你看完之后也会觉得离不开它们.他们 ...
- E-R图怎么绘制
E-R图中主要涉及到的元素有: 实体:用长方形表示 关联关系:用菱形表示 属性:用椭圆表示 参考一个例子:
- 上车时机已到--.NETCore是适应时代发展的雄鹰利剑
上车时机已到--.NETCore是适应时代发展的雄鹰利剑 要起飞了 .NET Core 3.0-prevew7:https://dotnet.microsoft.com/download/dotnet ...