本节内容

• 课时83 谷歌开发者工具其它使用(理解)
• 课时84 继承性(掌握)
• 课时85 层叠性(掌握)
• 课时86 优先级(掌握)
• 课时87 !important(掌握)
• 课时88 权重问题(掌握)
• 课时89 CSS三大特性练习(理解)

谷歌开发者工具其它使用

f12按开后自己玩去吧！

继承性

给我们的父元素设置的属性，子元素也是可以使用的，这就是继承性

注意点

• 并非所有属性都可继承，只有以color/font-/text-/line开头的属性是可以继承的
• 不仅仅是儿子可以继承，只要是后代都可以继承
• css继承性的特殊性：
  • a标签的字体颜色和下划线是不能继承的
  • h标签文字大小是不能继承的

应用场景

一般用于设置网页上的共性信息，如网页文字颜色，字体，文字大小等内容，一般情况下，这样设置：

body{
    骚操作;
}

层叠性

就是css处理冲突的一种能力，

注意点

• 只有在多个选择器选中“同一个标签”，然后设置了“相同的属性”，才会发生层叠性

优先级

当我们的多个选择器选中“同一个标签”，然后设置了“相同的属性”，如何层叠就由优先级来确定

优先级判断的三种方式

1. 是否是直接选中(间接选中就是指继承)

• 若是间接选中，谁离着标签近就听谁的

2. 相同的选择器

• 若都是直接选中，且都是同类型的选择器，谁写在后面就听谁的

3. 不同选择器

• 都是直接选中，并且不是相同类型的选择器，那么就会按照选择器的优先级来层叠
  • 选择器优先级：id>类>通配符>继承>浏览器默认

优先级之!important

用于提升摸个直接选中标签的选择器中的某个属性的优先级，可以将被指定的属性优先级提升为最高

注意

• 间接选中就不能用，必须是直接引用才行
• 通配符选择器选择的也是直接选中的
• 他只能提升被指定的优先级，其他属性的优先级不会被提升
• 他必须写在分号前面，斜后面就不对了
• 感叹号是不能省略的

优先级之权重问题

当多个选择器混合在一起使用的时候，可以计算权重判断谁的优先级最高

计算规则

1. 首先计算选择器中有多少个id，id多的选择器优先级最高
2. 若id个数一样，再看class的个数，class多的优先级最高
3. 若class个数一样，再看标签名称的个数，标签名称个数多的优先级最高
4. 若id、class、标签名称都一样的话，就不会继续往下计算权重，谁写在后面就听谁的

注意点

• 只有选择器直接选中标签的时候才计算权重