📂前端
🔖CSS
2022-02-01 18:40阅读: 33评论: 0推荐: 0

CSS 三大特性

CSS 三大特性

层叠性

样式冲突,遵循的原则是就近原则,哪个样式离结构近,就执行哪个样式
样式不冲突,不会层叠

继承性

恰当地使用继承可以简化代码,降低 CSS 样式的复杂性
子元素可以继承父元素的样式(text-,font-,line-这些元素开头的可以继承,以及 color 属性)

行高的继承性

body {
  font: 12px/1.5 "Microsoft yahei";
}
  • 行高可以跟单位也可以不跟单位
  • 如果子元素没有设置行高,则会继承父元素的行高为 1.5
  • 此时子元素的行高是:当前子元素的文字大小*1.5
  • body 行高 1.5 这样写法最大优势是里面子元素可以根据自己文字大小自动调整行高

优先级

选择器 选择器权重
继承 或者 * 0,0,0,0
元素选择器 0,0,0,1
类选择器,伪类选择器 0,0,1,0
ID 选择器 0,1,0,0
行内选择器 1,0,0,0
!important 重要的 ∞ 无穷大
  • !important 是加在属性值后面,例如:color: pink!important

注意事项

  • 权重是有 4 组数字组成,但不会有进位,这里的进位是指复合选择器优先级的叠加计算时不要算成是二进制,而是十进制
  • 可以理解为类选择器永远大于元素选择器,id 选择器永远大于类选择器,以此类推
  • 等级判断从左向右,如果某一位数值相同,则判断下一位数值.
  • 继承的权重为 0,如果该元素没有被直接选中,不管父元素权重多高,子元素得到的权重都是 0

本文作者:wedfrgt

本文链接:https://www.cnblogs.com/wedfrgt/p/15859443.html

版权声明:本作品采用知识共享署名-非商业性使用-禁止演绎 2.5 中国大陆许可协议进行许可。

posted @   wedfrgt  阅读(33)  评论(0编辑  收藏  举报
点击右上角即可分享
微信分享提示
评论
收藏
关注
推荐
深色
回顶
收起
  1. 1 404 not found REOL
  2. 2 悪魔の子(恶魔之子) Mochoc
  3. 3 冒険でしょでしょ? 平野綾
悪魔の子(恶魔之子) - Mochoc
00:00 / 00:00
An audio error has occurred, player will skip forward in 2 seconds.