CSS 选择器及其优先级

选择器 权重
内联样式 1000
id 选择器 100
类选择器 10
属性选择器 10
伪类选择器 10
标签选择器 1
伪元素选择器 1
相邻兄弟元素元素 0
子选择器 0
后代选择器 0
通配符选择器 0

注：

  • !important 声明的样式的优先级最高
  • 如果优先级相同，则最后出现的样式生效
  • 继承得到的样式的优先级最低
  • 通用选择器、子选择器、相邻兄弟选择器并不在这四个等级中，因为他们的权重为 0
  • 样式表的来源不同时，优先级顺序在；内联样式>内部样式>外部样式>浏览器用户自定义样式>浏览器默认样式

CSS 中可继承与不可继承的属性有哪些？

  1. 无继承性
  • display：规定元素应该生成的类型
  • 文本属性：
    • verical-align：垂直文本对齐
    • text-decoration：规定添加到文本的装饰
    • text-shadow：文本阴影效果
    • white-space：空白符的处理
    • unicode-bid：设置文本方向
  • 盒子模型属性：width、height、margin、border、padding
  • 背景属性：background、background-color、background-image、background-repeat、background-position、background-attachment
  • 定位属性：float、position、top、right、bottom、left、min-width、max-width、min-height、max-height、overflow、clip、z-index
  • 生成内容属性：content、counter-reset、counter-increment
  • 轮廓样式属性：outline-style、outline-width、outline-color、outline
  • 页面样式属性：size、page-break-before、page-break-after
  • 声音样式属性：pause-before、pause-after、pause、cue-before、cue-after、cue、play-during
  1. 有继承性
  • 字体系列属性
    • font-family:字体系列
    • font-weight：字体粗细
    • font-size：字体大小
    • font-style:字体风格
  • 文本系列
    • text-indent:文本缩进
    • text-align:文本水平对齐
    • line-height:行高
    • word-spacing:单词之间的间距
    • letter-spacing:中文或者字母之间的间距
    • text-transform:控制文本大小写
    • color:文本颜色
  • 元素可见性
    • visibility:控制元素显示隐藏
  • 列表布局属性
    • list-style:列表风格，包括 list-style-type、list-style-image 等
  • 光标属性
    • cursor:光标显示为何种形态