一、 层叠、优先级、继承

cascade 层叠：解决样式冲突判断依据：

样式表的来源：作者>用户 作者指定声明会覆盖用户 表明了 ！important 的声明优先级更高

选择器优先级：行内样式>其他声明(除非声明有“！important”才无法覆盖）ID选择器＞类选择器>标签选择器(类型选择器)
选择器ID数量多胜出
ID数量一致时 拥有类多的胜出
以上一致则拥有标签多的胜出

如何在优先级比较低的情况覆盖成功？
eg： 1，0，1 vs 0，1，0
加 ！important
提升优先级：.featured => #main-nav .featured (010-110)
降低优先级：把前者id换成类 #main-nav a => .nav a
                      把后者的优先级提升 .featured => .nav .feature

tips: 一开始让优先级尽可能的低，后续有覆盖空间

源码顺序：声明来源相同、优先级相同，出现的较晚的胜出（eg：.nav a  vs a .featured）

链接样式顺序：link-visited-hover-active 链接、访问、悬停、激活

浏览器遵循来源、优先级、源码顺序三步骤来解析属性，最终确定用于元素渲染的为层叠值。【用开发者工具-Element-Style查看层叠值】

经验法则：

在选择器中不要使用ID，会大幅提升优先级

不要使用!important

继承：如果一个元素的某个属性没有层叠值，可能会继承某个祖先元素的值，比如通常会给body元素加上font-family，里面的所有祖先元素都会继承这个字体，但不是所有属性都会被继承，主要是文本相关属性、还有列表属性，开发者工具可以查看

特殊值：赋给任意属性，用于控制层叠：inherit、initial
                inherit ：用继承代替一个层叠值
                initial：默认属性

auto不是所有属性的默认值，padding、border-width无auto，不会生效0

简写属性：同时给多个属性赋值，比如font：italic bold 18px/1.2 "Helvetica", "Arial“,sans-serif;

简写属性会默认隐式设置了默认值（没写bold 就默认是normal），要避免在body元素的通用样式以外使用font

margin、padding的属性上右下左，只有一个值运用到四个方向，其他情况缺少用对边数值

只支持两个值的比如定位（x,y）水平，垂直