zoukankan      html  css  js  c++  java
  • 关于元素优先级

    元素的优先级主要受样式名长度和位置影响。

    相同长度的情况下,受位置影响:

    <div class="class2 class1"></div>
    css:
      .class2{color:red}
      .class1{color:blue}

    这里class1的样式会覆盖class2,因为class2和class1的优先级相同,样式表中最后出现的会覆盖前面的样式。

    同一位置受长度影响:

    <div class="wrap">
    
         <p class="p1"></p>
    
    </div>

    长度A:".wrap .p1" 长度B:".p1"

    A和B都是指向样式名p1,但是A的长度比B长,所以会覆盖B的样式,也就是说样式名长的元素优先级大。

    补充几点点:

    1、ID的元素优先级是大于class的元素优先级,成立不受样式名位置和长度影响;

    2、在样式属性后面加 !important优先级大于上面任何一种情况;

    3、还有种情况就是导入外部css样式文件时,也是会受位置影响的,下面的优先与上面。

  • 相关阅读:
    vite的使用
    webpack--Plugin
    webpack--loader
    uniapp 或小程序,通过蓝牙连接设备, 给设备配网
    每一项与之前一项相加
    vue使用vue-fullpage
    React基礎
    无间隙循环轮播效果
    Wow.js动画效果
    正则表达式
  • 原文地址:https://www.cnblogs.com/Qzhou/p/3029950.html
Copyright © 2011-2022 走看看