zoukankan      html  css  js  c++  java
  • CSS学习笔记(三)层叠和特殊性

    在样式表现时,有可能会出现两个或更多的样式寻找同一元素,这就可能出现表现层的不确定性和样式冲突

    CSS通过“层叠”给每个规则分配一个重要度

    层叠一般采用以下重要度层次:

      * 标准!important的用户样式

      * 标准!important的作者样式

      * 作者样式

      * 用户样式

      * 浏览器和用户代理应用的样式

    根据选择器的特殊性决定规则的次序,若是特殊性相同,后定义的规则优先。

    特殊性

    为了计算选择器的特殊性,每种选择器被分配一个数字值,将规则的每个选择器的值加在一起,计算出规则的特殊性。

    选择器的特殊性分为四个等级:a、b、c、d

      * 行内样式一般为,a=1

      * b=ID选择器的数量

      * c=类、伪类和属性选择器的数量

      * d=类型选择器和伪元素选择器数量

    选择器                            特殊性                      以10为基数的特殊性

    style=""                           1,0,0,0                        1000

    #wp #content{}                        0,2,0,0                        200    

    #content .date{}                       0,1,1,0                        110

    div #conent{}                         0,1,0,1                        101

    p .content{}                         0,0,1,1                        11

    有上述特殊性计算可知,

    用style属性编写的规则总是比其他任何规则特殊

    有ID选择器的规则比没有ID选择器的规则特殊

    具有类选择器的规则比只具有类型选择器的规则特殊

    若特殊性相同,则后定义的规则优先

    在样式表中使用特殊性

    可以对一般元素使用一般样式,然后在更特殊的元素上覆盖它们

    form {width:30px}

    form#search {15px}

    一种使用特殊性的方法是在主体标签(body)上应用ID或类,这样可以根据页面或站点范围内覆盖样式

    #nav {float:left;}

    .homepage #nav {float:right;}

    继承

    应用样式的元素后代会继承样式的某些属性,比如,字体,字号,颜色

    p h1 h2 h3 ul li {color:black;}

    更简洁的作法是:

    body{color:black;}

  • 相关阅读:
    Android使用Fragment来实现TabHost的功能
    selendroid之toast处理
    selendroid之inspector
    杂技
    自动化测试框架
    保险数据分析
    订单分析指标
    CRM原型
    monkey 参数
    monkey基础操作
  • 原文地址:https://www.cnblogs.com/qixing/p/2856030.html
Copyright © 2011-2022 走看看