Jeeeeeeeeen

关于 "Anchor" 的伪类和属性

July 18, 2015 | 0 Minute Read

overview

HTML 中的 <a> 元素 (或HTML锚元素, Anchor Element) 用于定义一个超链接、指定的目标目的地一个超链接，或者两者都是。

pseudo-classes: :hover, :active, and :focus

<a> 的几个动态伪类定义顺序(相同优先级)： :link, visited, :hover, :active， 其中:link 表示未被访问过的链接。

	a:link { color: blue } /* unvisited links */
	a:visited { color: purple } /* visited links */
	a:hover { font-weight: bold } /* user hovers */
	a:active { color: lime } /* active links */

pseudo-class: :target

通过带hash的URL，链接到文档的目标元素。 :target 选择器可用于 当前活动的target元素的样式。

href attribute

该属性指定一个超文本链接，即为URL或URL片段，可以用一个hash符合来指定在目标文档的位置(id).

target attribute

<a target="_blank|_self|_parent|_top|framename">

  • _blank: 在新窗口中打开被链接文档。

  • _self: 默认。在相同的框架中打开被链接文档。

  • _parent: 在父框架集中打开被链接文档。

  • _top: 在整个窗口中打开被链接文档。

  • framename: 在指定的框架中打开被链接文档。

conclusion

旧事重提，这里又进一步认识 <a> 元素，有助于做好一些用户层面上的细节和体验。虽然没有什么难点，但总有一些被我们会忽略的东西，今天拿出来就是想做为一个引子，一方面对很少被周围的人提及的知识进行归纳，另一方面能够对此清晰认识一些。当然还认识到了 HTML5新属性download等 特性。

reference

Jeeeeeeeeen © 2015