CSS样式的状态hover、focus、active、link、visited详解
CSS ⼜名层叠样式表，是⼀种伪类⽤于向某些选择的容器添加特殊的效果，所谓层叠，就是后⾯的样式会覆盖前⾯的样式，所以不同的排列顺序可能会有不同的显⽰效果。下⾯介绍⼏个关于连接按钮效果的关键样式属性：
css鼠标点击样式
1 link控制未访问时的显⽰效果
2 hover⿏标悬停和划过时的显⽰效果
3 visited 访问过后的显⽰效果
4 active 控制按钮被点击时的显⽰效果。当所指定的元素处于激活状态（⿏标在元素上按下还没有松开）时所使⽤的样式；
5 focus 获得聚焦对象的元素，并设置聚焦时的显⽰效果。当元素获得光标焦点时使⽤的样式，主要⽤在⽂本框输⼊⽂字时使⽤；
link 与 visited 在样式⽂件中的顺序任意，相互之间没有影响。 ⽽focus， hover，active这这三个的顺序有要求，乱放后可能会出现显⽰的效果与预想的不同，正常顺序为:focus -> :hover -> :active
link代表为访问链接的样式，所以只要你是超链接，且未被访问过，则链接都会按照你设定的样式显⽰，所以它的位置顺序⽆所谓。
visited代表链接访问后的样式，则链接⼀旦被访问，则之后它的样式就会是你所设置的visited样式
focus 代表的是获取焦点时的样式，有⼈说啥是获取焦点时的样式，可以通过tab键来查看，⼀旦链接获取了焦点，则它的样式就是你设置的focus样式
hover 代表的是你光标经过某⼀元素时的样式，如果将此样式放在:focus之后，则当链接获取焦点时，显⽰:focus样式，当光标经过此链接时，会显⽰hover的样式，⽽将其放在focus前，则当⿏标滑过时显⽰的时focus的属性，因为其特性被覆盖了。
active 代表元素被激活时的样式，也就是元素被按下时的样式，如果:active选择器与 :focus , :hover 调换位置，则显⽰的效果也会不同，因为排在后⾯的样式，会覆盖前⾯的样式。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。