定义和用法
<a> 标签定义超链接，用于从一张页面链接到另一张页面。
<a> 元素最重要的属性是 href 属性，它指示链接的目标。
在所有浏览器中，链接的默认外观是：
- 未被访问的链接带有下划线而且是蓝色的
- 已被访问的链接带有下划线而且是紫色的
- 活动链接带有下划线而且是红色的
提示：您可能已经注意到了，W3School 站点内的链接外观与默认的链接外观非常不同。您可以使用 CSS 伪类向文本超链接添加复杂而多样的样式。
提示和注释
提示：如果不使用 href 属性，则不可以使用如下属性：download, hreflang, media, rel, target 以及 type 属。
提示：被链接页面通常显示在当前浏览器窗口中，除非您规定了另一个目标（target 属性）。
提示：请使用 CSS 来设置链接的样式。
属性
：HTML5中的新属性
|
属性 |
值 |
描述 |
例子 |
浏览器支持 |
|
download 5 |
filename（规定作为文件名来使用的文本。） |
规定被下载的超链接目标。 |
<a href="/images/myw3schoolimage.jpg"
|
只有 Firefox 和 Chrome 支持 |
|
href |
url 超链接的 URL。 可能的值：
|
规定链接指向的页面的 URL。 |
<a href="http://www.w3school.com.cn"> |
所有浏览器都支持 |
| hreflang |
hreflang="value" 双字符的语言代码，指定被链接文档的语言。 |
规定被链接文档的语言。 |
<a href="http://www.w3school.com.cn" hreflang="zh"> |
主流的浏览器几乎都不支持 |
| media 5 | media_query |
规定被链接文档是为何种媒介/设备优化的。 该属性用于规定目标 URL 是为特殊设备（比如 iPhone）、语音或打印媒介设计的。 该属性可接受多个值。 只能在 href 属性存在时使用。 |
<a href="att_a_media.asp?output=print" |
|
| rel | text | 规定当前文档与被链接文档之间的关系。
用于 <a> 标签的可选属性 rel 和 rev 分别表示源文档与目标文档之间正式的关系和方向。rel 属性指定从源文档到目标文档的关系，而 rev 属性则指定从目标文档到源文档的关系。这两种属性可以在 <a> 标签中同时使用。 rel 或 rev 属性的值都是以空格分隔的关系列表。实际的关系名和它们的含义取决于你自己：HTML 或 XHTML 标准并没有正式提出这两种属性。例如，一系列文档中的某个文档可能会在链接中包含它的关系： |
<a rel="friend" href="http://www.w3c.com/">w3c</a> |
所有浏览器都支持 rel 属性。 |
| target |
_blank (在新窗口中打开被链接文档。) _self (默认。在相同的框架中打开被链接文档。) _parent (在父框架集中打开被链接文档。) _top (在整个窗口中打开被链接文档。) framename (在指定的框架中打开被链接文档。) |
规定在何处打开链接文档。 |
<a href="http://www.w3school.com.cn/" target="_blank"> Visit W3School! </a> |
|
| type 5 |
被链接文档的 MIME 类型。 |
规定被链接文档的的 MIME 类型。 只能在 href 属性存在时使用。 |
<a href="http://www.w3school.com.cn" |
超链接样式
一组专门的预定义的类称为伪类，主要用来处理超链接的状态。超链接文字的状态可以通过伪类选择符＋样式规则来控制。伪类选择符包括：
总: a表示所有状态下的连接 如 a{color:red}
① a:link： 未访问链接 ,如 a:link {color:blue}
② a:visited： 已访问链接 ,如 a:visited{color:blue}
③ a:active： 激活时（链接获得焦点时）链接的颜色 ,如 a:active{color:blue}
④ a:hover： 鼠标移到链接上时 ,如 a:hover {color:blue}
一般a:hover和a:visited链接的状态（颜色、下划线等）应该是相同的。
前三者分别对应body元素的link、vlink、alink这三个属性。
四个“状态”的先后过程是：a:link ->a:hover ->a:active ->a:visited。
另外，a:active不能设置有无下划线（总是有的）。
举例：伪类的常见状态值
<style type="text/css">
a{font-size:16px;}
a:link{color:blue;text-decoration:none;} //未访问：蓝色，无下划线。
a:active{color:red;} // 激活：红色。
a:visited{color:purple;text-decoration:nonr;} //已访问：紫色，无下划线
a:hover{color:red;text-decoration:underline;} //鼠标移近：红色，下划线
</style>
如何去掉<a>的下划线：
对超链接下划线设置 使用代码"text-decoration"
语法：
text-decoration : none || underline || blink || overline || line-through
text-decoration参数：
none : 无装饰
blink : 闪烁
underline : 下划线
line-through : 贯穿线
overline : 上划线
去掉下划线的方法就是将其text-decoration设置为none即可。