HTML5标签使用方法详解


Posted in HTML / CSS onNovember 27, 2015

HTML 5 是一个新的网络标准,目标在于取代现有的 HTML 4.01, XHTML 1.0 and DOM Level 2 HTML 标准。它希望能够减少浏览器对于需要插件的丰富性网络应用服务(plug-in-based rich internet application,RIA),如Adobe Flash, Microsoft Silverlight, 与 Sun JavaFX 的需求。

HTML 5 提供了一些新的元素和属性,反映典型的现代用法网站。其中有些是技术上类似 <div> 和 <span> 标签,但有一定含义,例如 <nav>(网站导航块)和 <footer>。这种标签将有利于搜索引擎的索引整理、小屏幕装置和视障人士使用。同时为其他浏览要素提供了新的功能,通过一个标准接口,如 <audio> 和 <video> 标记。

HTML 5 作为新一代的超文本标记语言,增加了许多标签。这些标签不但更有语义,而且功能强大。具体有以下标签:

<article> 定义外部的内容。比如来自一个外部的新闻提供者的一篇新的文章,或者来自 blog 的文本,或者是来自论坛的文本。亦或是来自其他外部源内容。
<aside> 定义页面内容之外的内容,但应该与页面内容相关
<audio> 定义声音,比如音乐或其他音频流
<canvas> 定义图形,比如图表和其他图像。
<command> 定义命令按钮,比如单选按钮、复选框或按钮。
<datatemplate> 定义数据模板的一个容器。该元素必须有定义模板的子元素:<rule> 元素
<datagrid> 定义可选数据的列表。datagrid 作为树列表来显示
<datalist> 定义可选数据的列表。与 input 元素配合使用,就可以制作出输入值的下拉列表
<dialog> 定义对话,比如交谈
<embed> 定义嵌入的内容,比如插件
<event-source> 定义由服务器发送的事件的来源
<figure> 定义媒介内容的分组,以及它们的标题
<footer> 定义 section 或 document 的页脚
<header> 定义 section 或 document 的页眉
<hgroup> 将标题分组
<keygen> 定义生成密钥
<m> 定义带有记号的文本
<mark> 主要的功能就是在页面中高亮显示那些需要在视觉上向用户突出其重要性的文字。个比较典型的应用就是在搜索结果中向用户高亮显示搜索关键词
<meter> 定义度量(单位)。仅用于已知最大和最小值的度量
<nav> 定义导航链接
<nest> 在数据模板中为子元素定义嵌套点。与 <datatemplate> 和 <rule> 元素一同使用
<output> 定义不同类型的输出,比如脚本的输出
<progress> 运行中的进程。可以用来来显示 JavaScript 中耗费时间的函数的进程或下载的进度
<rule> 定义更新数据模板的规则。与 <datatemplate> 和 <nest> 元素一起使用
<rp> 在 ruby 注释中使用,以定义不支持 ruby 元素的浏览器所显示的内容
<rt> 定义汉字的拼音或日语汉字的平假名
<ruby> 定义亚洲语言中的“附注文字”
<section> 定义文档中的节(section)。比如章节、页眉、页脚或文档中的其他部分
<source> 为媒介元素(比如 <video> 和 <audio>)定义媒介资源
<summary> 定义一个摘要,即 detail 的头部。不等同于表格中的 summary 属性
<time> 定义日期或时间,或者两者
<video> 定义视频,比如电影片段或其他视频流

HTML5 增加了许多新标签,同时也废除了一些标签:

<acronym> 可以使用 <abbr> 代替
<applet> 不再支持
<basefont> 用 CSS 代替
<big> 用 CSS 代替
<center> 用 CSS 代替
<dir> 用 CSS 代替
<font> 用 CSS 代替
<frame> 不再支持
<frameset> 不再支持
<noframes> 不再支持
<s> 用 CSS 代替
<small> 用 CSS 代替
<strike> 用 CSS 代替
<tt> 用 CSS 代替
<u> 用 CSS 代替
上面这些标签在 XHTML 1.0 是不建议使用的,但仍然可以支持,而在 HTML 5 中则彻底不支持了。另外还有很多标签属性也不支持,如 aling 等。

HTML / CSS 相关文章推荐
使用CSS3的rem属性制作响应式页面布局的要点解析
May 24 HTML / CSS
css3 box-sizing属性使用参考指南
Jan 08 HTML / CSS
CSS3中background-clip和background-origin的区别示例介绍
Mar 10 HTML / CSS
CSS3动画:5种预载动画效果实例
Apr 05 HTML / CSS
CSS3 实现的加载动画
Dec 07 HTML / CSS
HTML5混合开发二维码扫描以及调用本地摄像头
Dec 27 HTML / CSS
使用HTML5的表单验证的简单示例
Sep 09 HTML / CSS
html5 postMessage解决跨域、跨窗口消息传递方案
Dec 20 HTML / CSS
CSS3 Tab动画实例之背景切换动态效果
Aug 23 HTML / CSS
如何利用 CSS Overview 面板重构优化你的网站
Oct 24 HTML / CSS
HTML静态页面获取url参数和UserAgent的实现
Aug 05 HTML / CSS
推荐WEB开发者最佳HTML5和CSS3代码生成器
Nov 24 #HTML / CSS
分享29个基于Bootstrap的HTML5响应式网页设计模板
Nov 19 #HTML / CSS
不可轻视HTML5!App三年内将被html5顶替彻底消失
Nov 18 #HTML / CSS
使用纯HTML5编写一款网页上的时钟的代码分享
Nov 16 #HTML / CSS
五个2015 年最佳HTML5 框架
Nov 11 #HTML / CSS
使用html5 canvas 画时钟代码实例分享
Nov 11 #HTML / CSS
HTML5几个设计和修改的页面范例分享
Sep 29 #HTML / CSS
You might like
spl_autoload_register与autoload的区别详解
2013/06/03 PHP
windows8.1下Apache+Php+MySQL配置步骤
2015/10/30 PHP
PHP实现字符串翻转功能的方法【递归与循环算法】
2017/11/03 PHP
ThinkPHP框架实现FTP图片上传功能示例
2019/04/08 PHP
不想让浏览器运行javascript脚本的方法
2015/11/20 Javascript
JS实现图片平面旋转的方法
2016/03/01 Javascript
Node.js的基本知识简单汇总
2016/09/19 Javascript
js 中获取制定的cook信息实现方法
2016/11/19 Javascript
nodejs服务搭建教程 nodejs访问本地站点文件
2017/04/07 NodeJs
Node.js+Express+MySql实现用户登录注册功能
2017/07/10 Javascript
Ionic3实现图片瀑布流布局
2017/08/09 Javascript
ES6 javascript的异步操作实例详解
2017/10/30 Javascript
JS写谷歌浏览器chrome的外挂实例
2018/01/11 Javascript
记一次Vue.js混入mixin的使用(分权限管理页面)
2019/04/17 Javascript
javascript删除数组元素的七个方法示例
2019/09/09 Javascript
JavaScript回调函数callback用法解析
2020/01/14 Javascript
微信小程序实现转盘抽奖
2020/09/21 Javascript
Vue实现图书管理案例
2021/01/20 Vue.js
使用原生javascript开发计算器实例代码
2021/02/21 Javascript
[03:35]2018年度DOTA2最佳辅助位选手5号位-完美盛典
2018/12/17 DOTA
介绍Python中的一些高级编程技巧
2015/04/02 Python
python学习--使用QQ邮箱发送邮件代码实例
2019/04/16 Python
python实现五子棋人机对战游戏
2020/03/25 Python
python中的Elasticsearch操作汇总
2019/10/30 Python
python实现双人五子棋(终端版)
2020/12/30 Python
HTML5 CSS3新的WEB标准和浏览器支持
2009/07/16 HTML / CSS
利用canvas实现图片压缩的示例代码
2018/07/17 HTML / CSS
Sasa莎莎海外旗舰店:香港莎莎美妆平台
2018/03/21 全球购物
Sneaker Studio波兰:购买运动鞋
2018/04/28 全球购物
英国No.1体育用品零售商:SportsDirect.com
2019/10/16 全球购物
英国领先的鞋类零售商和顶级品牌的官方零售商:Wynsors
2020/02/17 全球购物
群众路线批评与自我批评
2014/02/06 职场文书
2016年基层党组织创先争优承诺书
2016/03/25 职场文书
MySQL 条件查询的常用操作
2022/04/28 MySQL
CSS子盒子水平和垂直居中的五种方法
2022/07/23 HTML / CSS
MySql统计函数COUNT的具体使用详解
2022/08/14 MySQL