css3 选择器:动态伪类选择器(一)

:link
:visited
:active
:hover
:focus
  • :link


    1-1
    1-2
    
1-3

:link 只能用于 a 标签,并且标签带有 href 属性时,才会匹配到。

css3 选择器:动态伪类选择器(一)_第1张图片

  • :visited


    1-1
    1-2
    1-3

当点击 1-2 中的链接后,1-2会应用到 :visited 状态。同时由于 1-3 与 1-2 访问的链接一样,1-3 也会变成绿色。

  • :active


    1-1
    

表示元素被鼠标按下,但未松开前的状态。适用于所有元素,该状态在移动端浏览器下无效。


  • :hover


    1-1
    
    1-3
    
1-4

表示元素在鼠标进入时匹配该样式,移出元素后会被取消。适用于所有元素,该状态在移动端浏览器下无效。


css3 选择器:动态伪类选择器(一)_第2张图片
  • :focus


    1-1
    
    1-3
    
1-4

abutton 标签在 PC 端被点击后可以应用到 focus 状态,在移动端则不能。divspan 则无论如何都无法应用到 focus 状态。表单元素在两个端都能正常应用到 focus 状态。

css3 选择器:动态伪类选择器(一)_第3张图片

你可能感兴趣的:(css3 选择器:动态伪类选择器(一))