css类选择器类名覆盖优先级


  • code
<style>
   .a{
      background: red;
   }
   .b{
      background: yellow;
   }
</style>
<div class="a b">A</div>
  • 渲染效果

最初以为更改元素中class类里面的类名顺序,渲染效果就会根据类名顺序依次渲染

  • code
<style>
   .a{
      background: red;
   }
   .b{
      background: yellow;
   }
</style>
<div class="b a">A</div>
  • 渲染效果

更改元素class里面类名的顺序并不能影响渲染顺序

  • code
   <style>
   .b{
      background: yellow;
   }
   .a{
      background: red;
   }
   </style>
<div class="a b">A</div>
  • 渲染效果

更改样式表里类的顺序 渲染顺序受到影响

结论:两个类中有同样的属性覆盖顺序是css样式表从下往上的顺序


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM