css继承与权重

css继承与权重

关于css的样式继承

• 不可继承的：baidisplay、dumargin、border、padding、background、height、min-height、max- height、width、min-width、max-width、overflow、position、left、right、top、 bottom、float、clear、table-layout、vertical-align、page-break-after、 page-bread-before和unicode-bidi。
• 所有子元素可继承：visibility和cursor、z-index。
• 内联元素可继承：letter-spacing、word-spacing、white-space、line-height、color、font、 font-family、font-size、font-style、font-variant、font-weight、text- decoration、text-transform、direction。
• 块状元素可继承：text-indent和text-align。
• 列表元素可继承：list-style、list-style-type、list-style-position、list-style-image。
• 表格元素可继承：border-collapse。

关于css的权值统计

• 统计内联样式的属性个数 1000
• 统计选择符中的ID属性个数 0100
• 统计选择符中的CLASS属性(伪类)个数 0010
• 统计选择符中的HTML标记名格式 0001
• 继承的样式权值为0（无法覆盖元素的默认样式）

    <div style="color:pink;font-size:20px">粉色盒子
        <a href="#">a标签</a>
        <span>span标签</span>
    </div>

• !important对应最大权值 ∞
  在设置时应注意放置顺序

        #cat{
            color: blue;
            background-color: pink;
        }
        .apple {
            color: red !important;
            background-color: black;
        }

color生效了，变成了红色，但是background-color还是粉色，不是黑色