zoukankan      html  css  js  c++  java
  • css权重问题

    权重决定了你css规则怎样被浏览器解析直到生效。“css权重关系到你的css规则是怎样显示的

    权重记忆口诀。从0开始,一个行内样式+1000,一个id+100,一个属性选择器/class或者伪类+10,一个元素名,或者伪元素+1

    类型权重
    ! important 无穷
    行间样式 1000
    id 100
    class/属性选择器/伪类:hover 10
    标签选择器/伪元素:after 1
    通配符 0
    01. *{}                         ====》0
    02. li{}                        ====》1(一个元素)
    03. li:first-line{}             ====》2(一个元素,一个伪元素)
    04. ul li {}                    ====》2(两个元素)
    05. ul ol+li{}                  ====》3(三个元素)
    06. h1+ *[rel=up] {}            ====》11(一个属性选择器,一个元素)
    07. ul ol li.red{}              ====》13(一个类,三个元素)
    08. li.red.level{}              ====》21(两个类,一个元素)
    09. style=""                    ====》1000(一个行内样式)
    10. p {}                        ====》1(一个元素)
    11. div p {}                    ====》2(两个元素)
    12. .sith {}                    ====》10(一个类)
    13. div p.sith{}                ====》12(一个类,两个元素)
    14. #sith{}                     ====》100(一个ID选择器)
    15. body #darkside .sith p {}   ====》112(1+100+10+1,一个Id选择器,一个类,两个元素)</pre>

    原作者:
    作者:Cherry丶小丸子
    链接:https://www.jianshu.com/p/983ff63adaa6

  • 相关阅读:
    Python-02 基础语法
    Python-01 基础语法
    windows端口被占用-解决方案
    vue两个独立的组件之间的传值通信
    URI
    Inversion of control
    7月10日每日总结
    7月9日每日总结
    xshell终端设置主机名和用户名颜色
    PyTorch中一些损失函数的使用
  • 原文地址:https://www.cnblogs.com/codeByWei/p/11795874.html
Copyright © 2011-2022 走看看