【CSS】简略说明css的权重之分

    /*权重 ：id > class > 标签  （小环境）

        权重：内联 > 内部 > 外部  （大环境）

         小环境处于内部环境中

    */

    <style>              

        #p1{    /* id类选择器 */

            css样式

        }        

        .class{        /* class类选择器 */  

            css样式

        }

        p #p3,#p1 {     /* 混合选择    p3不生效 */

            css样式

        }

        p#p3,#p1 {     /* 更为精确的混合选择    权重除内联之外最大        p1,p3都生效 */

            css样式

        }

        p {        /* 标签选择    权重小于混合选择 */

            css样式

        }

        .class1:before {  /* 调用伪元素选择器的结构类方法 */

            content: "";

        }

        </style>

 

还有一种情况就是使用!important，在这种情况下就会有所不同。

.test{
    color:#fff !important;
}

!important的css定义是拥有最高的优先级的，优先于以上的内联、内部、外部