css加载顺序

最近发现个有意思的事情,印象中的是css中class后面会覆盖前面的,

于是写了代码

         div{
             width: 100px;
             height: 100px;
         }
         .red{
             background-color: red;
         }
         .yellow{
             background-color: yellow;
         }

<div class="yellow red "></div>

发现仍然为黄色,于是把css的顺序换了下

        div{
            width: 100px;
            height: 100px;
        }
        .yellow{
            background-color: yellow;
        }
        .red{
            background-color: red;
        }

    <div class="red yellow "></div>

即使把class的顺序调换,颜色也仍为红色,

由此可见:css的样式类在浏览器加载css文件是覆盖就已经完成,而不是在读取html样式类时才进行覆盖

原文地址:https://www.cnblogs.com/ones/p/9230423.html