html5的语义化 标签 以及 属性 ,可以让开发者非常方便地实现清晰的web 页面 布局, 加上 css3的 效果 渲染, 快速 建立丰富灵活的web 页面 显得非常简单。
html5 新元素
自1999年以后HTML 4.01 已经改变了很多,今天,在HTML 4.01中的几个已经被废弃,这些元素在HTML5中已经被 删除 或重新定义。
为了更好地处理今天的互联网应用,HTML5 添加 了很多新元素及 功能 ,比如: 图形的绘制,多媒体 内容 ,更好的 页面 结构,更好的形式 处理,和几个api拖放元素,定位, 包括 网页 应用程序缓存,存储,网络工作者等。
HTML5的新 标签 元素
<header>定义 页面 或区段的头部;
<footer>定义 页面 或区段的尾部;
<nav>定义 页面 或区段的导航区域;
<section> 页面 的逻辑区域或 内容 组合;
<article>定义正文或一篇完整的 内容 ;
<aside>定义补充或相关 内容 ;
nav导航 标签
示例
<!doctype?html><html><head> < Meta ?charset="UTF-8"> <title>HTML5?Nav导航 标签 的使用</title> </head> <body> <nav> ????<ul> ????????<li><a?href="#">Home</a></li> ????????<li><a?href="#">One</a></li> ????????<li><a?href="#">Two</a></li> ????????<li><a?href="#">Three</a></li> ????</ul> </nav> </body></html>
<header> 标签 实现
示例
<!doctype?html> <html> <head> < Meta ?charset="UTF-8"> <title><header> 标签 实现?by?www.F2er.com</title> </head> <body> <header?id="page_header"> ????<h1>Header</h1> </header> </body> </html>
<footer> 标签 实现
示例
<!doctype?html> <html> <head> < Meta ?charset="UTF-8"> <title><footer> 标签 实现?by?www.F2er.com</title> </head> <body> <footer> 标签 实现 <footer?id="page_footer"> ????<h2>Footer</h2> </footer> </body> </html>
<section>区块和<article> 文章
示例
<!doctype?html> <html> <head> < Meta ?charset="UTF-8"> <title><section>和<article> 标签 实现?by?www.F2er.com</title> </head> <body> <section>和<article> 标签 实现 <section?id="posts"> ????????/*可以包含多个<?article>*/ ????<article?class="post"> ?????????/*article的 内容 */ ????????</article> ????????<article?class="post"> ?????????/*article的 内容 */ ????????</article> </section> </body> </html>
<canvas> 新元素 标签 描述 <canvas> 标签 定义图形,比如图表和其它图像
新多媒体元素
标签
描述
<au dio >
定义音频 内容<video>
定义视频 ( video 或者 movie )<source>
定义多媒体资源 <video> 和 <au dio ><em bed >
定义嵌入的 内容 ,比如 插件<track>
为诸如 <video> 和 <au dio > 元素之类的媒介规定外部文本轨道
HTML5 新表单元素
标签
描述
<datalist>
定义选项列表需要与 input 元素配合使用该元素,来定义 input 可能的值
<keygen>
规定用于表单的密钥对 生成 器字段<output>
定义不同类型的 输出 ,比如脚本的 输出
新的语义和结构元素
HTML5 提供了新的元素来创建更好的 页面 结构
标签 描述<article>
定义 页面 独立的 内容 区域<aside>
定义 页面 的 侧边栏 内容<bdi>
允许设置一段文本,使其脱离其父元素的文本方向设置<command>?
定义命令按钮,比如单选按钮、复选框或按钮<details>
用于描述文档或文档某个部分的细节<dialog>
定义对话框,比如 提示 框<summary>
标签 包含 details 元素的 标题< fig ure>
规定独立的流 内容 (图像、图表、照片、 代码 等等)< fig caption>
定义 < fig ure> 元素的 标题<footer>
定义 section 或 document 的页脚<header>
定义了文档的头部区域<mark>
定义带有记号的文本<meter>
定义度量衡。仅用于已知最大和最小值的度量<nav>
定义导航 链接 的部分<progress>
定义任何类型的任务的进度<ruby>
定义 ruby 注释( 中文 注音或字符)<rt>
定义字符( 中文 注音或字符)的解释或发音<rp>
在 ruby 注释中使用,定义 不支持 ruby 元素的浏览器所 显示 的 内容<section>
定义文档中的节(section、区段)<time>
定义日期或时间<wbr>
规定在文本中的何处适合 添加 换行符
已移除的元素
下面列出的 HTML 4.01 元素在 HTML5 中已经被 删除
<acronym>
<applet>
<basefont>
<big>
<center>
<dir>
<font>
<frame>
<frameset>
<noframes>
<strike>
<tt>
HTML5 Video 视频 ? ?HTML5 浏览器支持