结构与层叠

选择器的特殊性

特殊性从高到低排列, 同级特殊性相加比较,不能跨级比较

  • 内联样式- ID选择器
  • 类选择器、属性选择器、伪类选择器
  • 元素选择器、伪元素选择器
  • 通配符选择器
  • 继承样式

样式来源

CSS中的样式一共有三种来源:创作人员、读者和用户代理,来源的不同会影响到样式的层叠方式

  • 创作人员样式
    • 前端开发者写的那些样式
  • 用户代理样式
    • 浏览器提供的默认样式
  • 读者样式
    • 浏览网页的用户通过浏览器提供的接口为网站添加的样式
    • 添加方法:IE可以通过Internet 选项 -> 外观 -> 辅助功能 -> 用户样式表来指定样式文件。Chrome可以使用Stylish扩展来实现
Paste_Image.png

权重规则:

  • 读者!important样式 > 创作人员!important样式 > 创作人员正常样式 >读者正常样式 > 用户代理样式

层叠规则

  1. 找出同一个规则有冲突的所有选择器
  2. 如果有多个样式来源,根据样式来源的权重大小确定样式
  3. 第二点不能确定样式,根据选择器的特殊性高低确定样式
  4. 第三点不能确定样式,根据规则出现的顺序先后确定样式
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容