HTML的常用标签

1. a标签 创建超链接，可以链接到其他网页、文件、同页面其他位置、邮件地址或其他url。

示例

• 链接到外部地址

<a href="http://www.baidu.com">百度</a>

• 链接到本页某处

<a href="#top">返回顶部</a>

2. form标签 表示文档中一个区域，包括交互控制元件，向web服务器提交信息。

示例

• 使用fieldset、legend、label的表单

<form action=" " method="post">
 <fieldset>
   <legend>
     <input type="radio" name="radio" id="radio">
     <label for="radio">Click me</label>
   </legend>
 </fieldset>
</form>

3. input标签 为基于web的表单创建交互式控件，以便接收用户数据。

• type属性默认为text，可用值有：

可用值	含义	备注
button	无缺省按钮
checkbox	复选框
radio	单选按钮
submit	提交表单的按钮
img	图片提交按钮
color	选取颜色的控件	HTML5新增
date	输入日期的控件	HTML5新增
datetime	基于UTC时区的日期、时间输入控件	HTML5新增
month	输入年月控件，不带时区	HTML5新增
week	输入星期-年组成的日期，不带时区	HTML5新增
time	输入不含时区的时间控件	HTML5新增
number	输入浮点数的控件	HTML5新增
range	输入不精确值的控件	HTML5新增
search	输入搜索字符串的单行文本字段	HTML5新增
email	用于编辑email的字段	HTML5新增
url	用于编辑url的字段	HTML5新增
等等	--	--

示例

• 在拾色器中选取颜色,并提交

选择颜色：<input type="color" name="color"><br>
<input type="submit">

4. button标签 一个可点击的按钮，包含?全局属性?。

示例

• 创建一个按钮

<button name="button">Click me</button>

注：如果你的按钮不用于向服务器提交数据，将 type 属性设置成 button。否则它们被按下后会向服务器发送数据并加载（可能并不存在的）响应内容，因而可能会破坏当前文档的状态。

5. h1~h6标签 标题，<h1>最大，数字越大字号越小。
6. p标签 表示段落。
7. ul标签 无序列表。

示例

• 无序列表

<ul>
 <li>第一项
 <li>第二项
 <li>第三项
</ul>

8. ol标签 有序列表。

• type属性可选值有：

值	含义
a	小写字母编号
A	大写字母编号
i	小写罗马数字编号
I	大写罗马数字编号
1	阿拉伯数字编号(默认）

• start属性，HTML5新增的，用于标注列表开始序号

示例

• 有序列表， 以小写字母为编号，从c开始

<ol type="a" start="3">
 <li>第一项
 <li>第二项
 <li>第三项
</ol>

9. small标签 使文本字体变小一号。
10. strong标签 粗体显示，以示重要（区别于b标签）
11. div标签 区块元素，定义文档的区域。
12. span标签 内联元素，组合文档的行内元素，可做文本容器。
13. kbd标签 键盘输入元素。
14. video标签 在文档中嵌入视频。

示例

• 嵌入视频

<video width="300" height="200" controls>
 <source src="movie.mp4" type="video/mp4">
 <source src="movie.ogg" type="video/ogg">
 您的浏览器不支持 HTML5 video 标签。
</video>

• controls属性用于提供用户控制，包括播放、暂停、音量、跨帧。

15. audio标签 文档中插入音频。

示例

• 播放音频

<audio controls>
 <source src="dadada.mp3" type="audio/mpeg">
 <source src="dadada.ogg" type="audio/ogg">
 您的浏览器不支持该音频格式。
</audio>

16. iframe标签 内联框架元素，表示嵌套地浏览上下文，在当前HTML文档中嵌入另一个文档。

示例

• 嵌套页面

<iframe src="http://www.baidu.com"></iframe>