MyException - 我的异常网
当前位置:我的异常网» HTML/CSS » HTML标签集锦

HTML标签集锦

www.MyException.Cn  网友分享于:2013-12-30  浏览:0次
HTML标签汇总

这里我记录下HTML所有标签,按照参考手册总结记录下:

 

<!--...--> 定义注释

<!DOCTYPE> 定义文档类型

 

按照字母排序

a:

 

<a>                  定义链接(锚)

 

<abbr>             定义简称或缩写,可以在 <abbr> 标签中使用全局的 title 属性,这样就能够在鼠标指针移动到该元素上时显示出简称/缩写的完整版本,语法:

The <abbr title="People's Republic of China">PRC</abbr> was founded in 1949

 

<acronym>       定义一个首字母缩写,效果与<abbr>类似。但H5 中不支持 <acronym> 标签,一般使用<abbr>标签代替,语法:

<acronym title="World Wide Web">WWW</acronym>

 

 <address>     定义文档或文章的作者/拥有者的联系信息,元素中的文本通常呈现为斜体。大多数浏览器会在 address 元素前后添加折行。语法:

<address>
Written by <a href="mailto:webmaster@example.com">Donald Duck</a>.</br> 
Visit us at:</br>
Example.com</br>
Box 564, Disneyland</br>
USA
</address>

 

 <area>           定义图像映射中的区域(注:图像映射指得是带有可点击区域的图像),且area 元素总是嵌套在 <map> 标签中

 注释:<img> 标签中的 usemap 属性与 map 元素 name 属性相关联,创建图像与映射之间的联系

HTML 与 XHTML 之间的差异:

在 HTML 中,<area> 没有结束标签;在 XHTML 中,<area> 必须正确地关闭

 

<article>       规定独立的自包含内容(H5的新标签)。<article>元素的潜在来源:论坛帖子,报纸文章,博客条目,用户评论

 

<aside>         定义其所处内容之外的内容,aside 的内容应该与附近的内容相关。<aside> 的内容可用作文章的侧栏。

 

<audio>     定义声音,比如音乐或其他音频流(H5的新标签)

 

 

b:

<b>               定义粗体字,<tt> <i> <b> <big> <small> 均是字体样式元素。并不被反对使用这些标签。但是如果只是希望通过这些标签单纯地改变文本的样式,建议使用样式表来取得更加丰富的效果

 

 <base>     为页面上的所有链接规定默认地址或默认目标。

通常情况下,浏览器会从当前文档的 URL 中提取相应的元素来填写相对 URL 中的空白。使用 <base> 标签可以改变这一点。浏览器随后将不再使用当前文档的 URL,而使用指定的基本 URL 来解析所有的相对 URL。这其中包括 <a>、<img>、<link>、<form> 标签中的 URL。

【注释:<base> 标签必须位于 head 元素内部】

 

<!DOCTYPE>
<html>
<head>
    <meta charset="UTF-8">
    <base href="http://www.w3school.com.cn/i/" />
    <base target="_blank" />
</head>
<body>
<img src="eg_smile.gif" /><br />
<p>请注意,我们已经为图像规定了一个相对地址。由于我们已经在 head 部分规定了一个基准 URL,
浏览器将在如下地址寻找图片:</p>
<p>"http://www.w3school.com.cn/i/eg_smile.gif"</p>

<br /><br />
<p><a href="http://www.w3school.com.cn">W3School</a></p>
<p>请注意,链接会在新窗口中打开,即使链接中没有 target="_blank" 属性。这是因为 base 元素
的 target 属性已经被设置为 "_blank" 了。</p>
</body>
</html>
 
【拓展】 

可选的属性:

target
  • _blank(在新窗口中打开被链接文档)
  • _parent(在父框架集中打开被链接文档)
  • _self(默认。在相同的框架中打开被链接文档)
  • _top(在整个窗口中打开被链接文档)
  • framename(在指定的框架中打开被链接文档)
在何处打开页面中所有的链接。

 

 <bdo>      可覆盖默认的文本方向,一般常用来改变文本方向语法:

 

<bdo dir="rtl">Here is some text</bdo>
 可选属性:dir="rtl"为反向文本,dir="ltr"为正向正向文本
<big>         定义大号文本
<body>           定义文档的主体
<br>                定义简单的折行。空标签(意味着它没有结束标签,因此这是错误的:<br></br>)。在 XHTML 中,把结束标签放在开始标签中,也就是 <br />。我们一般写成</br>
<button>      定义一个按钮                                                                                                【重要事项】                                                                                                                    ①如果在 HTML 表单中使用 button 元素,不同的浏览器会提交不同的值。Internet Explorer 将提交 <button> 与 <button/> 之间的文本,而其他浏览器将提交 value 属性的内容。                                ②请在 HTML 表单中使用 input 元素来创建按钮请始终为按钮规定 type 属性。Internet Explorer 的默认类型是 "button",而其他浏览器中(包括 W3C 规范)的默认值是 "submit"
 
 
c:
<canvas>         定义图形,比如图表和其他图像(H5的新标签)只是图形容器,必须使用脚本来绘制图形
 
caption             定义表格标题。必须紧随 table 标签之后。只能对每个表格定义一个标题。通常这个标题会被居中于表格之上
<cite>             定义引用。可使用该标签对参考文献的引用进行定义,比如书籍或杂志的标题
<code>              定义计算机代码文本
<col>              <col> 标签规定了 <colgroup> 元素内部的每一列的列属性。通过使用 <col> 标签,可以向整个列应用样式,而不需要重复为每个单元格或每一行设置样式
<colgroup>      定义表格中供格式化的列组,语法:                                                                                         
<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>(runoob.com)</title> 
</head>
<body>
<table border="1">
  <colgroup>
    <col span="2" style="background-color:red">
    <col style="background-color:yellow">
  </colgroup>
  <tr>
    <th>ISBN</th>
    <th>Title</th>
    <th>Price</th>
  </tr>
  <tr>
    <td>3476896</td>
    <td>My first HTML</td>
    <td>$53</td>
  </tr>
  <tr>
    <td>5869207</td>
    <td>My first CSS</td>
    <td>$49</td>
  </tr>
</table>
</body>
</html>
 
 <datalist>                       定义选项列表(HTML 5 中的新标签)【IE和Sarafi不支持<datalist> 标签】
①请与 input 元素配合使用该元素,来定义 input 可能的值。                                                             
②datalist 及其选项不会被显示出来,它仅仅是合法的输入值列表。                                                             
③请使用 input 元素的 list 属性来绑定 datalist。
<input id="myCar" list="cars" />
<datalist id="cars">
  <option value="BMW">
  <option value="Ford">
  <option value="Volvo">
</datalist>
 
 <dd>                         定义列表中定义条目的定义部分
 
<dt>                           定义了定义列表中的项目(即术语部分)
<dl>
   <dt>计算机</dt>
   <dd>用来计算的仪器 ... ...</dd>
   <dt>显示器</dt>
   <dd>以视觉方式显示信息的装置 ... ...</dd>
</dl>
 
 
 

 

 

 

 

 

 

 

 

.

文章评论

写给自己也写给你 自己到底该何去何从
写给自己也写给你 自己到底该何去何从
为什么程序员都是夜猫子
为什么程序员都是夜猫子
Java程序员必看电影
Java程序员必看电影
如何成为一名黑客
如何成为一名黑客
程序员必看的十大电影
程序员必看的十大电影
一个程序员的时间管理
一个程序员的时间管理
初级 vs 高级开发者 哪个性价比更高?
初级 vs 高级开发者 哪个性价比更高?
团队中“技术大拿”并非越多越好
团队中“技术大拿”并非越多越好
5款最佳正则表达式编辑调试器
5款最佳正则表达式编辑调试器
程序员都该阅读的书
程序员都该阅读的书
“懒”出效率是程序员的美德
“懒”出效率是程序员的美德
为啥Android手机总会越用越慢?
为啥Android手机总会越用越慢?
编程语言是女人
编程语言是女人
中美印日四国程序员比较
中美印日四国程序员比较
不懂技术不要对懂技术的人说这很容易实现
不懂技术不要对懂技术的人说这很容易实现
程序员的一天:一寸光阴一寸金
程序员的一天:一寸光阴一寸金
2013年美国开发者薪资调查报告
2013年美国开发者薪资调查报告
程序员应该关注的一些事儿
程序员应该关注的一些事儿
总结2014中国互联网十大段子
总结2014中国互联网十大段子
程序员和编码员之间的区别
程序员和编码员之间的区别
那些性感的让人尖叫的程序员
那些性感的让人尖叫的程序员
“肮脏的”IT工作排行榜
“肮脏的”IT工作排行榜
2013年中国软件开发者薪资调查报告
2013年中国软件开发者薪资调查报告
程序员眼里IE浏览器是什么样的
程序员眼里IE浏览器是什么样的
当下全球最炙手可热的八位少年创业者
当下全球最炙手可热的八位少年创业者
10个帮程序员减压放松的网站
10个帮程序员减压放松的网站
什么才是优秀的用户界面设计
什么才是优秀的用户界面设计
Java 与 .NET 的平台发展之争
Java 与 .NET 的平台发展之争
我的丈夫是个程序员
我的丈夫是个程序员
程序猿的崛起——Growth Hacker
程序猿的崛起——Growth Hacker
做程序猿的老婆应该注意的一些事情
做程序猿的老婆应该注意的一些事情
旅行,写作,编程
旅行,写作,编程
老程序员的下场
老程序员的下场
Web开发者需具备的8个好习惯
Web开发者需具备的8个好习惯
漫画:程序员的工作
漫画:程序员的工作
60个开发者不容错过的免费资源库
60个开发者不容错过的免费资源库
我跳槽是因为他们的显示器更大
我跳槽是因为他们的显示器更大
代码女神横空出世
代码女神横空出世
程序员周末都喜欢做什么?
程序员周末都喜欢做什么?
科技史上最臭名昭著的13大罪犯
科技史上最臭名昭著的13大罪犯
十大编程算法助程序员走上高手之路
十大编程算法助程序员走上高手之路
看13位CEO、创始人和高管如何提高工作效率
看13位CEO、创始人和高管如何提高工作效率
如何区分一个程序员是“老手“还是“新手“?
如何区分一个程序员是“老手“还是“新手“?
亲爱的项目经理,我恨你
亲爱的项目经理,我恨你
每天工作4小时的程序员
每天工作4小时的程序员
10个调试和排错的小建议
10个调试和排错的小建议
程序员最害怕的5件事 你中招了吗?
程序员最害怕的5件事 你中招了吗?
Web开发人员为什么越来越懒了?
Web开发人员为什么越来越懒了?
Google伦敦新总部 犹如星级庄园
Google伦敦新总部 犹如星级庄园
软件开发程序错误异常ExceptionCopyright © 2009-2015 MyException 版权所有