zoukankan      html  css  js  c++  java
  • CSS—伪类及伪元素

    历史
      
    伪类最开始的时候只是用来表示元素的动态(典型的锚伪类link、visited、hover、active) 
       在CSS2标准中对它进行了扩展让它虽然逻辑存在但不需要在DOM树中标识 
       伪元素代表了某个元素的子元素,虽然逻辑存在,但不存在于DOM树

    定义

    • 伪类:用于向某些选择器添加特殊的效果,伪类的效果可以通过添加实际的类来实现 。
    • 伪元素:用于将特殊的效果添加到某些选择器,伪元素的效果可以通过添加实际的元素来实现 。

    举例

    一、链接伪类:
    a:link——链接未访问

    a:visited——链接访问过后

    a:hover——鼠标悬停在链接上

    a:active——鼠标点击连接时

    二、段落伪元素
    :/::first-letter——首字母下沉

    :/::first-line——首行变化颜色

    ::selection——鼠标选中内容

    三、其他伪类
    :hover——鼠标悬停在元素上

    :focus——元素获取焦点时

    四、其他伪元素
    :before/:after——在指定元素前/后添加内容

    优先级


    在计算权重的时候 :

    • 伪类与类优先级相同 。
    • 伪元素与标签优先级相同。

    总结

    • 伪类与伪元素都是用于向选择器加特殊效果
    • 伪类与伪元素的本质区别就是是否抽象创造了新元素
    • 伪类只要不是互斥可以叠加使用
    • 伪元素在一个选择器中只能出现一次,并且只能出现在末尾
    • 伪类与伪元素优先级分别与类、标签优先级相同
  • 相关阅读:
    C语言寒假大作战02
    C语言寒假大作战01
    C语言I作业12
    C语言I博客作业11
    C语言I博客作业10
    C语言I博客作业09
    C语言I作业08
    C语言ㅍ作业01 结构:通讯录
    C语言寒假大作战04
    C语言寒假大作战03
  • 原文地址:https://www.cnblogs.com/hbv1/p/9855323.html
Copyright © 2011-2022 走看看