CSS的三大核心特性——层叠性、继承性和优先级,是每个前端开发者必须掌握的基础知识。它们共同决定了CSS规则如何应用于HTML元素,理解这些特性是编写高效、可维护CSS代码的关键。
一、层叠性
层叠性是CSS的核心特性之一,它决定了当多个CSS规则应用于同一个元素时,哪个规则最终生效。
二、继承性
继承性允许子元素继承父元素的某些样式属性,减少了重复代码的编写,优先继承离得近的。
常见的可继承属性:text-?? , font-?? , line-?? 、 color ......,并不是所有样式都被继承,常见的
背景相关的。
三、优先级
优先级决定了当多个规则作用于同一元素时,哪个规则最终生效,判断规则在(二)中。
四、三大特性使用技巧
-
合理利用继承性
-
在body设置基础字体、颜色
-
使用CSS变量实现主题继承
-
-
优化优先级
-
避免过度使用ID选择器
-
减少!important的使用
-
使用类选择器代替元素选择器
-
-
层叠性控制
-
模块化CSS组织
-
遵循一致的样式书写顺序
-