关于HTML标签的总结
来源：互联网 发布：vmware软件购买 编辑：程序博客网 时间：2024/05/17 02:50
HTML文档
文档声明：<!doctype html>
文档头部：<head>其中可以嵌套<meta><title><link><style>
文档主体：<body>
HTML注释：<!--这里是注释内容--->
注意：HTML5中加入了一些新的标签，为的是能够更加对文档结构语义化
例如：<header> <nav> <article> <section> <aside> <footer>
<header>在首部位置，多用于对主页的介绍，通常内嵌<h1~h6><p>。
<nav>在导航位置，多用于定义导航链接的部分。
<article>规定独立的自包含内容。<article>元素的潜在来源：论坛帖子，报纸文章，博客条目，用户评论。
<section>标签定义文档中的节（section、区段）。比如章节、页眉、页脚或文档中的其他部分。
<aside>在侧栏位置，常用来定义其所处内容之外的内容。
<footer>在尾部位置，定义文档或节的页脚。页脚通常包含文档的作者、版权信息、使用条款链接、联系信息等等。
下面按照字母顺序来对标签进行一个总结。
<a>
<a> 标签定义超链接，多用于从一张页面链接到另一张页面。
一共有三个用法：
1.创建指向另外一个页面或者文档的链接。<a href=”http://www.baidu.com”>。跳转的方式可以设置，默认的是在当前窗口显示，即target=”_self”；在新窗口显示，即target=“_blank”。
2.创建一个文档内部的锚点。所谓锚点就是在导航面板上点击相应超链接，页面下拉到相应区域。即<a href=”#name”>XXX</a>，然后在所需要的下拉位置上的元素添加一个id属性，这里以div元素来举例，即:<div id=”name”>XXX</div>。
3.链接到e-mail地址。即<a href=”mailto:xxxxx@gmail.com”>联系我们</a>。这里面也可以设置发件人，主题等。
<abbr>
<abbr>标签标记一个缩写，通过对缩写进行标记，您能够为浏览器、拼写检查和搜索引擎提供有用的信息。可以用在WTO,NATO等缩写单词上。
<adress>
<adress>标签定义文档或文章的作者/拥有者的联系信息。通常浏览器默认为斜体。
<area> <map>
<area> 标签定义图像映射中的区域。通常嵌套在<map>内部使用。
<autio>
<audio>是HTML5新标签，该定义声音，比如音乐或其他音频流。其中src属性可以添加要播放的音频的URL；controls属性可以设置播放按钮。
<b><h><strong><em><mark>
<b>标签是表示粗体文本。但是需要注意的是在HTML5规范中规定：在没有其他合适的标签的情况下，才可以使用<b>标签来作为最后的选项。应该使用<h1>-<h6>来表示标题，<em>来表示强调的文本，<strong>来表示重要的文本，<mark>来表示标注的/突出显示的文本。ps:现在HTML5规范中着重提现了标签的语义化，b标签没有语义化，只是视觉上的粗体，所以是个备胎选择。
<base>
<base>标签为页面上的所有链接规定默认地址或默认目标。在没有设置<base>标签时，浏览器会从当前文档的URL中提取相应的元素来填写相对URL中的空白。有了<base>之后，可以使用指定的基本URL来解析所有的相对URL。这其中包括 <a>、<img>、<link>、<form> 标签中的 URL。另外一点，<base>必须提前声明，所以必须嵌套在<head>里。
<bdo>
<bdo>标签用于设置文本的排版方向。所以<bdo>的值有两个，ltr和rtl。
<blockquote>
<blockquote>标签主要用于块引用。Ps：对于短的引用我们用<q>标签来处理。
<br>
<br>标签是一个换行，通常是在一段话里使用，仅仅是个换行符，没有特殊意义。该标签没有结束标签。可以表示为<br>或者按照XHTML中的<br/>。
<button>
<button>标签定义了一个按钮。在页面上画一个按钮，有四种办法：
1.<input type=”button”>当然不写js的话，按下去什么也不会发生。
2.<input type=”submit”>点击之后会自动提交form。
3.<button>点击之后自动提交，和前两个方法相比，有点是按钮的内容不仅可以是文本，还可以是图片等多媒体内容。但缺点是不同的浏览器得到的value值是不一样的，IE中是提交了<button></button>之间的内容，而其他浏览器是提交了value属性的值。另外这种方法还会存在兼容性的问题。
4.其他标签，例如a，img，span，div，然后用图片把它伪装成一个按钮。
<canvas>
<canvas>标签是嵌入图形的。多用于动态的，复杂的图形。而相对的svg主要是用于静态的，简单的矢量图形。
<center>
<center>标签主要是把其所包括的内容进行水平居中设置。该标签一般不使用，因为一般使用CSS来进行居中设置的。
<cite>
<cite>标签通常表示引用的出处。如作品的名称，一个人物等。
<code>
<code>标签定义引用计算机代码文本。
<col>
<col>标签多用于设置表格的列对齐方式。
<dl><dt><dd>
<dl>标签用来创建一个列表；<dt>用来创建列表中的上层项目;<dd>用来创建列表中的最下层项目。这组标签的灵活运用，可以减少页面的class调用。
<del><ins>
<del>标签主要是定义文档中已被删除的文本。<ins>标签主要是定义已经被插入文档中的文本。两者搭配使用。可以在电商中的价格区域使用。
<dfn>
<dfn>标签主要是定义一个定义项目。
<div>
<div>标签主要是定义文档中的分区域节。<div>是一个块级元素，意味着它的内容自动开始一个新行，另外一点是常在div上设置class和id属性，从而通过CSS来设置样式。
<embed>
<embed>标签定义嵌入的内容，比如插件等。例：<embed src=”helloworld.swf”/>
<fieldset><legend>
<fieldset>标签主要是将表单内的相关元素分组。即当一组表单元素放到<fieldset>标签内时，浏览器会以特殊方式来显示它们，一般是以特殊的边界来显示。
<legend>标签通常是为fieldset元素定义标题。
HTML代码：
<form>
<fieldset>
<legend>健康信息</legend>
身高：<input type="text" />
体重：<input type="text" />
</fieldset>
</form>
效果图：
<figure><figcaption>
<figure>标签是用作文档中的流内容（图像，图标，照片，代码等）。
<figcaption>标签定义figure元素的标题。
<font>
<font>规定文本的字体，字体尺寸，字体颜色。但是通常还是使用class或id属性来通过CSS来设置字体。
<form>
<form>标签用于为用户输入创建HTML表单，表单是用于向服务器传输数据的。该元素是一个块级元素，其前后会产生折行。该标签一般会内嵌input元素，可以设置文本字段，单选框，复选框，提交按钮等等。常用属性有action和method。action：提交表单到的后台地址；method：提交表单的方式（通常为post）。
<hr>
<hr>标签是在HTML页面中创建一条水平线，可以在视觉上将文档分隔成各个部分。
<i>
<i>标签显示斜体文本效果。
<iframe>
<iframe>标签是创建包含另外一个文档的内联框架，也就是嵌入一个页面，在嵌入页面的操作不影响当前页面。比如在很多网站上有的那些第三方广告、网易云音乐上的网页播放器不想随页面的刷新而刷新，这些都可以通过把其放在另一个页面上，通过iframe来嵌入主页面。
<img>
<img>标签是向网页中嵌入一个图片。该标签有两个必需属性，即src和alt。src添加的是图片的URL地址，alt添加的是描述该图片的文本（在网络不好时或图片加载不出来时，alt替代src的图片）。有两个常用可选属性，即height和width。
<input>
<input>标签用于搜集用户信息。根据其不同的type值，输入字段拥有多种形式。其最重要的属性是type，下面来一一介绍。
1.type=text 这种输入类型是text，这是最常见的属性值，比如登陆输入用户名，注册输入电话号码等等。这个也是input的默认类型。
参数name：表示该文本输入框的名称；
参数size：表示输入框的长度大小；
参数maxlength：表示输入框允许输入的字符最大数；
参数value：表示输入框中的默认值；
参数readonly：表示该框中只能显示，不能修改，即只读模式。
2.type=password 这种输入类型是密码输入框，在此输入框输入信息时显示为保密字符。参数和text类似。
3.type=button 标准的windows风格的按钮，需要加入JS代码才能跳转到某个页面上。
4.type=checkbox 多选框，常见于注册时选择爱好、性格等信息。参数有name（多选框的name值最好一样）,value及特别参数checked（表示默认选择）其实最重要的还是value值，提交到处理页的也就是value。
5.type=radio 即单选框，出现在多选一的页面设定中。参数同样有name,value及特别参数checked.不同于checkbox的是，name值一定要相同，否则就不能多选一。当然提交到处理页的也还是value值。
6.type=submit 和 type=reset分别是“提交”和“重置”两按钮submit主要功能是将form中所有内容进行提交action页处理，reset则起个快速清空所有填写内容的功能。
placeholder 另外一个较为常用的是HTML5新增加的属性，placeholder，该属性的值为text，规定了帮助用户填写输入字段的提示。
<label>
<label>标签为input元素定义标注。常用属性是for，该属性可以把label绑定到另外一个元素上，通常是绑定在input元素上，所以常常把label的for属性值设置为input元素的id属性值。
<ul><ol><li>
<ul>和<li>一起创建无序列表；<ol>和<li>一起创建有序列表。
需要注意的一点是：列表可以嵌套。
<link>
<link>标签通常用来链接样式表。此元素只能存在于head部分，不过可以出现任何次数。
例：<link rel=”stylesheet” type=”text/css” href=”task_1.css”>
<select><option><optgroup>
<select>标签可以创建下拉选择框。常用属性：multiple和name。Multiple规定可选择多个选项，name规定了下拉列表的名称。
<option>标签定义下拉列表中的一个选项。常用的属性有selected和value，前者表示选项在首次显示时表现为选中状态；value定义了送往服务器的选项值。
<optgroup>标签是定义选项组，该元素的label属性的值为索要设置选项组名称。把相关选项组合在一起：
<select>
<optgroup label="Swedish Cars">
<option value="volvo">Volvo</option>
<option value="saax">Saab</option>
</optgroup>
<optgroup label="German Cars">
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</optgroup>
</select>
其效果图如下：
<p>
<p>标签定义段落。
<pre>
<pre>定义预格式化的文本。被包围在pre元素中的文本通常会保留空行和换行符。其常运用于计算机的源代码。
<progress>
<progress>标签标示了任务的进度。但是IE9及以下不支持。
<script>
<script>标签用于定义客户端脚本，比如JavaScript。通常可以直接加入脚本或者指向外部脚本文件。用法如下：
<script type=”text/javascript”>
Document.write(“heelo world”)
</script>
或者
<script src=”1.js”>
<source>
<source>标签为媒介元素（比如<video>和<audio>）定义媒介资源。IE8及以下不支持该标签。
拥有两份源文件的音频播放器。浏览器应该选择它所支持的文件（如果有的话）：
<audio controls>
<source src="horse.ogg" type="audio/ogg">
<source src="horse.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
下面的这一句是在浏览器不支持音频元素时才会出现。
<span>
<span>标签被用来组合文档中的行内元素。通常的用法是对<span>元素添加class属性或者id属性，既可以增加语义性，又便于对span应用样式。
<style>
<style>标签用于为HTML文档定义样式信息。该元素的type属性是必需的，定义style元素的内容。唯一可能的值是“text/css”，该元素位于head部分中。这是通常不这样设置。通常还是用<link>标签来引用外部样式表。
<sub><sup>
前者定义下标文本，后者定义上标文本。
<table><caption><thead><tbody><tfoot><tr><th><td>
<table>在HTML文档中创建一个表格
<caption>标签定义表格的标题，必须紧随table标签之后。并且每个表格最多只能定义1个标题，浏览器默认是在表格的上方居中位置。
<thead>表格的头部
<tbody>表格的主体内容
<tfoot>表格的尾部
<tr>定义表格行
<th>定义表头
<td>定义表格单元
其中th和td都具有colspan及rowspan属性，表示表格的跨行和跨列。
<textarea>
<textarea>标签定义多行的文本输入控件。通过cols和rows属性来规定textarea的尺寸（最好是通过CSS的height和width来设置宽高），另外可以通过该元素的wrap属性来设置文本输入区内的换行模式。
<title>
<title>标签定义文档的标题。
<u>
<u>标签可定义下划线文本。但是最好不要使用该标签，可能造成用户把它与超链接混淆。
<video>
<video>标签定义视频，比如电影片段或者其他视频流。该标签是HTML5新标签，所以IE8及以下不支持。例子：
<video src=”movie.ogg” controls=”controls”>
您的浏览器不支持video标签。
</video>
- 关于HTML标签的总结
- HTML的标签总结
- 关于html的doctype标签
- 关于HTML的排版标签
- 关于HTML的字体标签
- 关于HTML的图片标签
- 关于HTML的超链接标签
- 关于HTML的清单标签
- 关于HTML的表格标签
- 关于HTML的表单标签
- 关于HTML的多媒体标签
- 关于Html标签的嵌套
- 我总结的html标签
- 常用的HTML标签总结
- HTML常用的标签总结
- 关于html 中a标签添加点击事件的方法总结
- Html中关于多媒体的标签
- 关于html隐藏标签的问题
- An article about hash function for hash table
- Java方法与主方法
- How to set a badge value on a UITabBarController item
- 重构的认知（一）
- css中为什么经常见到img{dispaly:block}？
- 关于HTML标签的总结
- linux以rpm方式安装ftp软件
- CSS中background用法
- text-align：center和margin：0 auto的用法和区别
- CSS的定位元素position用法
- CSS中float布局用法
- Java构造方法的应用
- css中消除浮动有哪些方式？
- flex的用法分析
