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——在指定元素前/后添加内容

    优先级


    在计算权重的时候 :

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

    总结

    • 伪类与伪元素都是用于向选择器加特殊效果
    • 伪类与伪元素的本质区别就是是否抽象创造了新元素
    • 伪类只要不是互斥可以叠加使用
    • 伪元素在一个选择器中只能出现一次,并且只能出现在末尾
    • 伪类与伪元素优先级分别与类、标签优先级相同
  • 相关阅读:
    tar命令,vi编辑器
    Linux命令、权限
    Color Transfer between Images code实现
    利用Eclipse使用Java OpenCV(Using OpenCV Java with Eclipse)
    Matrix Factorization SVD 矩阵分解
    ZOJ Problem Set
    Machine Learning
    ZOJ Problem Set
    ZOJ Problem Set
    ZOJ Problem Set
  • 原文地址:https://www.cnblogs.com/hbv1/p/9855323.html
Copyright © 2011-2022 走看看