link、visited、focus、hover、active的
作者:
原上的小木屋 | 来源:发表于
2019-03-02 14:59 被阅读0次
:active
向被激活的元素添加样式,表示当所指元素处于激活状态(鼠标在元素上按下还没有松开)时所显示的颜色。
:focus
向拥有键盘输入焦点的元素添加样式,表示元素获得光标焦点时使用的颜色,主要用于文本框输入文字时使用(鼠标松开时显示的颜色)。
:hover
当鼠标悬浮在元素上方时,向元素添加样式,表示鼠标悬停时显示的颜色。
:link
向未被访问的链接添加样式,表示链接在正常情况下(即页面刚加载完成时)显示的颜色。
:visited
向已被访问的链接添加样式,表示链接被点击后显示的颜色。
- :link 与 :visited 在样式文件中的顺序可以随便放置
- :link代表为访问链接的样式,所以只要你是超链接,且未被访问过,则链接都会按照你设定的样式显示,所以它的位置顺序无所谓;
- :visited代表链接访问后的样式,则链接一旦被访问,则之后它的样式就会是你所设置的visited样式
- :focus 与:hover在样式文件中的顺序关系
- :focus 代表的是获取焦点时的样式,有人说啥是获取焦点时的样式,这个我们可以通过tab键来查看,一旦链接获取了焦点,则它的样式就是你设置的focus样式
- :hover 代表的是你光标经过某一元素时的样式,如果将此样式放在:focus之后,则当链接获取焦点时,显示:focus样式,当光标经过此链接时,会显示hover的样式,因为hover排在后,会覆盖focus样式。
- :hover 与 :visited在样式文件中的关系
- a:hover属性写在了visited之后
因此:css中关于超链接的五个属性一般正常顺序为:link,visited,focus,hover,active
a:hover 必须被置于 a:link 和 a:visited 之后,才是有效的。
a:active 必须被置于 a:hover 之后,才是有效的。
本文标题:link、visited、focus、hover、active的
本文链接:https://www.haomeiwen.com/subject/cvuudqtx.html
网友评论