HTML5标签介绍与使用

转自:http://www.cnblogs.com/weishuai/archive/2010/07/24/1784348.html

HTML5 规范包括一系列新的语义元素,用于提供 Web 页面的各个区域或部分的意义,例如页眉、页脚、导航等等。在以前版本的 HTML 中,通常使用 <div> 元素来创建这些部分,使用 ID 或 类属性来区分它们。这样做的问题是这没有任何语义意义,因为没有定义严格的规则来指定要使用的类名称或 ID,使软件极其难以确定特定区域的操作。HTML5 应该可以帮助解决这些问题,使 Web 浏览器更容易分析文档的语义结构。

HTML 5 引入的主要语义元素包括:
<header>
此元素用于定义 Web 页面的某些部分的标题,可以是整个页面、<article> 元素或 <section> 元素。
<footer>
与 <header> 元素类似,此新元素定义页面的某些部分的页脚。页脚不一定是在页面、文章或区域的结尾,但是它通常是在那个位置。
<nav>
这是 Web 页面上主要导航链接的容器。此元素不应用于所有链接组,而是应仅用于主要导航块。如果您有一个 <footer> 元素包含导航链接,不需要将这些链接封装在 <nav> 元素中,因为 <footer> 元素将可以独自包括这些链接。
<article>
<article> 元素用于定义页面上可以独自分布的独立项目,例如新闻项目、博客或评论。此类项目通常使用 RSS feed 来联合。
<section>
此元素表示文档或应用程序的一部分,例如,文章或教程的一章或一节。例如,您现在正在阅读的章节在 HTML5 中可以使用 <section> 元素括起来。<section> 元素通常具有一个页眉,虽然严格来说是不需要的。例如,您现在正在阅读的章节的页眉将包含文本 “语义元素”。
<aside>
此新元素可以用于标记边栏或一些将认为与其周围内容有点无关的内容。此项的一个例子就是广告块。
<hgroup>
在某些情况下,页面、文章或区域可能需要多个标题,例如,您有一个标题和一个副标题。例如,本教程具有标题 “使用 HTML5 和 CSS3 创建现代 Web 站点” 和副标题 “在 HTML5 中实施 canvas 和 video 元素”。您可以在 <hgroup> 元素中封装这些标题,使用 <h1> 元素表示主标题,<h2> 元素表示副标题。

除此之外,还有 <audio> 和 <video> 元素用来替代 Web 当前对 Flash 作为一种多媒体交付平台的依赖

<canvas> 元素
<canvas> 元素最初是由 Apple® 开发的,用于 Mac OS X Dashboard 部件和 Safari 中,但是后来被 Mozilla® 和 Opera® 用于它们的 Web 浏览器中。该元素已经被标准化并与一系列 2D 绘图 API 包括在 HTML5 规范中,这些 API可以用于创建该元素内的形状、文本、过渡和动画。

许多人相信 <canvas> 元素是 HTML5 最重要的一个方面,因为它可以促进快速创建图表、交互式游戏、绘图应用程序以及其他图形,而无需 Adobe Flash 等外部插件。

<canvas> 元素自身是非常基础的,定义对象的宽度、高度和惟一 ID。然后,开发人员必须使用一系列 JavaScript API 在 canvas 实际绘制对象,通常是在 Web 页面已经完成了呈现后。这些 API 允许开发人员绘制形状和线条;应用颜色、不透明性以及倾斜度;转换 canvas 对象;以及执行动画。这些 API 还允许 <canvas> 成为交互式的并对鼠标操作和键操作等用户输入做出响应,从而促进在 canvas 上创建游戏和 Web 应用程序。

使用 <audio> 和 <video>


按字母顺序排列

* 4: 指示在 HTML 4.01 中是否定义了该元素
* 5: 指示在 HTML 5 中是否定义了该元素

标签 描述 4 5
<!–…–> 定义注释。 4 5
<!DOCTYPE> 定义文档类型。 4 5
<a> 定义超链接。 4 5
<abbr> 定义缩写。 4 5
<acronym> 不支持。定义首字母缩写。 4
<address> 定义地址元素。 4 5
<applet> 不支持。定义 applet。 4
<area> 定义图像映射中的区域。 4 5
<article> 定义 article。 5
<aside> 定义页面内容之外的内容。 5
<audio> 定义声音内容。 5
<b> 定义粗体文本。 4 5
<base> 定义页面中所有链接的基准 URL。 4 5
<basefont> 不支持。请使用 CSS 代替。 4
<bdo> 定义文本显示的方向。 4 5
<big> 不支持。定义大号文本。 4
<blockquote> 定义长的引用。 4 5
<body> 定义 body 元素。 4 5
<br> 插入换行符。 4 5
<button> 定义按钮。 4 5
<canvas> 定义图形。 5
<caption> 定义表格标题。 4 5
<center> 不支持。定义居中的文本。 4
<cite> 定义引用。 4 5
<code> 定义计算机代码文本。 4 5
<col> 定义表格列的属性。 4 5
<colgroup> 定义表格列的分组。 4 5
<command> 定义命令按钮。 5
<datagrid> 定义树列表 (tree-list) 中的数据。 5
<datalist> 定义下拉列表。 5
<datatemplate> 定义数据模板。 5
<dd> 定义定义的描述。 4 5
<del> 定义删除文本。 4 5
<details> 定义元素的细节。 5
<dialog> 定义对话(会话)。 5
<dir> 不支持。定义目录列表。 4
<div> 定义文档中的一个部分。 4 5
<dfn> 定义定义项目。 4 5
<dl> 定义定义列表。 4 5
<dt> 定义定义的项目。 4 5
<em> 定义强调文本。 4 5
<embed> 定义外部交互内容或插件。 5
<event-source> 为服务器发送的事件定义目标。 5
<fieldset> 定义 fieldset。 4 5
<figure> 定义媒介内容的分组,以及它们的标题。 5
<font> 不赞成。定义文本的字体、尺寸和颜色。 4
<footer> 定义 section 或 page 的页脚。 5
<form> 定义表单。 4 5
<frame> 不支持。定义子窗口(框架)。 4
<frameset> 不支持。定义框架的集。 4
<h1> to <h6> 定义标题 1 到标题 6。 4 5
<head> 定义关于文档的信息。 4 5
<header> 定义 section 或 page 的页眉。 5
<hr> 定义水平线。 4 5
<html> 定义 html 文档。 4 5
<i> 定义斜体文本。 4 5
<iframe> 定义行内的子窗口(框架)。 4 5
<img> 定义图像。 4 5
<input> 定义输入域。 4 5
<ins> 定义插入文本。 4 5
<isindex> 不支持。定义单行的输入域。 4
<kbd> 定义键盘文本。 4 5
<label> 定义表单控件的标注。 4 5
<legend> 定义 fieldset 中的标题。 4 5
<li> 定义列表的项目。 4 5
<link> 定义资源引用。 4 5
<m> 定义有记号的文本。 5
<map> 定义图像映射。 4 5
<menu> 定义菜单列表。 4 5
<meta> 定义元信息。 4 5
<meter> 定义预定义范围内的度量。 5
<nav> 定义导航链接。 5
<nest> 定义数据模板中的嵌套点。 5
<noframes> 不支持。定义 noframe 部分。 4
<noscript> 不支持。定义 noscript 部分。 4
<object> 定义嵌入对象。 4 5
<ol> 定义有序列表。 4 5
<optgroup> 定义选项组。 4 5
<option> 定义下拉列表中的选项。 4 5
<output> 定义输出的一些类型。 5
<p> 定义段落。 4 5
<param> 为对象定义参数。 4 5
<pre> 定义预格式化文本。 4 5
<progress> 定义任何类型的任务的进度。 5
<q> 定义短的引用。 4 5
<rule> 为升级模板定义规则。 5
<s> 不支持。定义加删除线的文本。 4
<samp> 定义样本计算机代码。 4 5
<script> 定义脚本。 4 5
<section> 定义 section。 5
<select> 定义可选列表。 4 5
<small> 不支持。定义小号文本。 4 5
<source> 定义媒介源。 5
<span> 定义文档中的 section。 4 5
<strike> 不支持。定义加删除线的文本。 4
<strong> 定义强调文本。 4 5
<style> 定义样式定义。 4 5
<sub> 定义上标文本。 4 5
<sup> 定义下标文本。 4 5
<table> 定义表格。 4 5
<tbody> 定义表格的主体。 4 5
<td> 定义表格单元。 4 5
<textarea> 定义 textarea。 4 5
<tfoot> 定义表格的脚注。 4 5
<th> 定义表头。 4 5
<thead> 定义表头。 4 5
<time> 定义日期/时间。 5
<title> 定义文档的标题。 4 5
<tr> 定义表格行。 4 5
<tt> 不支持。定义打字机文本。 4
<u> 不支持。定义下划线文本。 4
<ul> 定义无序列表。 4 5
<var> 定义变量。 4 5
<video> 定义视频。 5
<xmp> 不支持。定义预格式文本。 4 5
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值