南宫网站建设,如何建网站免费,app开发教程视频,Wordpress文章页面小工具CSS 有三个非常重要的三个特性#xff1a;层叠性、继承性、优先级。 层叠性
场景#xff1a;相同选择器给设置相同的样式#xff0c;此时一个样式就会覆盖#xff08;层叠#xff09;另一个冲突的样式。层叠性主要解决样式冲突 的问题
原则#xff1a;
样式冲突层叠性、继承性、优先级。 层叠性
场景相同选择器给设置相同的样式此时一个样式就会覆盖层叠另一个冲突的样式。层叠性主要解决样式冲突 的问题
原则
样式冲突遵循的原则是就近原则哪个样式离结构近就执行哪个样式
样式不冲突不会层叠
层叠性在条件相同的情况下会前面的样式会覆盖前面的样式
列如 最后文字会显示成粉色 继承性
CSS中的继承: 子标签会继承父标签的某些样式如文本颜色和字号。简单的理解就是子承父业。
特点
恰当地使用继承可以简化代码降低 CSS 样式的复杂性 子元素可以继承父元素的样式text-font-line-这些元素开头的可以继承以及color属性 继承性口诀龙生龙凤生凤老鼠生的孩子会打洞
列如 p标签没有对文字颜色进行设置但div设置了而div是p标签的父亲所以就继承了div的属性最后显示成粉色 行高的继承性
行高可以跟单位也可以不跟单位 如果子元素没有设置行高则会继承父元素的行高为 1.5 此时子元素的行高是当前子元素的文字大小 * 1.5 body 行高 1.5 这样写法最大的优势就是里面子元素可以根据自己文字大小自动调整行高 优先级
当同一个元素指定多个选择器就会有优先级的产生。
选择器相同则执行层叠性
选择器不同则根据选择器权重执行 注意 1. 权重是有4组数字组成,但是不会有进位。 2. 可以理解为类选择器永远大于元素选择器, id选择器永远大于类选择器,以此类推.. 3. 等级判断从左向右如果某一位数值相同则判断下一位数值。4. 可以简单记忆法: 通配符和继承权重为0, 标签选择器为1,类(伪类)选择器为 10, id选择器 100, 行内样式表为1000, !important 无穷大. 5. 继承的权重是0 如果该元素没有直接选中不管父元素权重多高子元素得到的权重都是 0。 列如 div ul li ------ 0,0,0,3 .nav ul li ------ 0,0,1,2 a:hover -----— 0,0,1,1 .nav a ------ 0,0,1,1
