html5学习系列——简介加a标签
html5 的新特性:
(1)用于绘画的canvas元素
(2)用于媒介回放的video和audio元素
(3)对本地离线存储有更好的支持
(4)新的特殊内容元素
(5)新的表单控件。
旧标签:
(1)a标签
作用:超链接,如果没有href属性,就仅仅是一个超链接的占位符。
属性:
href:链接的目标url;
hreflang:规定目标url的基准语言
media:url的媒介类型,默认值为all;
ping:由空格分隔的url列表;
rel:规定当前文档与目标 URL 之间的关系;
target:在何处打开目标 URL,target="_blank"打开新页面;
type:规定目标 URL 的 MIME 类型。之前的所有属性仅在href属性存在时使用。
name属性使用id代替
现在用过的属性是href、id、target
(2)<area>标签
作用:定义图像映射中的区域。
属性:
alt:定义此区域的替换文本,如果href存在,则该属性是必须的;croods:定义可点击区域的坐标;href:定义此区域的目标url;hreflang:规定目标url的基准语言 ;media:url的媒介类型,默认值为all;rel:规定当前文档与目标 URL 之间的关系;ping:由空格分隔的 URL 列表,当用户点击该链接时,这些 URL 会获得通知。
仅在 href 属性存在时使用。
shape:规定区域的形状; target:在何处打开目标 URL;type:规定目标 URL 的 MIME 类型。
新属性:media,ping
新标签:
(1)<abbr>标签
作用:表示一个缩写形式
title属性显示完整版本;
(2)<address>标签
作用:为文档或section定义联系方式;
通常显示为斜体。大多数浏览器会在前后加上一个换行符。
(3)<article>标签
作用:定义外部的内容。比如来自一个外部的新闻提供者的一篇新的文章,或者来自blog的文本。
<article>标签独立于文档的其余部分。
(4)<aside>标签
作用:定义article以外的内容。aside的内容应该与article的内容相关。
用于文档的侧栏。
(5)<audio>标签
作用:定义声音,比如音乐或其他音频流。
属性:
autopaly: true | false 如果是 true,则音频在就绪后马上播放。
controls: true | false 如果是 true,则向用户显示控件,比如播放按钮。
src: 所播放音频的 url。
start: 定义播放器在音频流中开始播放的位置。默认地,声音在开头进行播放。
end: 定义播放器在音频流中的何处停止播放。默认地,声音会播放到结尾。
loopend: 定义在音频流中循环播放停止的位置,默认是 end 属性的值。
loopstart: 定义在音频流中循环播放的开始位置。默认是 start 属性的值。
playcount: 定义音频片断播放多少次。默认是 1。
三、涉及到的代码:
<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>html学习</title> </head> <body> <!-- a标签 --> <a href="http://www.html5china.com" target="_blank">html5中文网</a> <a>html5中文网</a> <!-- abbr标签 --> <abbr title="etcetera">etc.</abbr> <!-- address标签 --> <address> 此文档的作者:<a href="#">Gabby</a> </address> <!-- area标签 --> <img src="test.jpg" alt="Planets" usemap="#testmap"> <map id="testmap"> <area shape="rect" coords="0,0,82,126" href="sun.htm" alt="Sun"/> <area shape="circle" coords="90,58,3" href="sun.htm" alt="Mercury"/> <area shape="circle" coords="124,58,8" href="sun.htm" alt="Vernus"/> </map> <!-- article标签 --> <article> <h2>Article</h2> AOL has now officially announced that they will end the development and support of all Netscape browsers. </article> <!-- aside标签 --> <aside>Aside 的内容是独立的内容,但应与文档内容相关。 </aside> <!-- audio标签 --> <audio src="test.mp3" controls="true">您的浏览器不支持audio</audio> </body> </html>