/*权重 :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定义是拥有最高的优先级的,优先于以上的内联、内部、外部

05-28 12:35