【前言】总结助理解,实践出真知。
【1】子选择器 与 后代(包含)选择器:
①子选择器:
关键符:大于符号(>)
作用对象:指定标签元素的第一代子元素
如:css中: #rebook>li{}
html中:<ul id="rebook">
<li></li>
</ul>
②后代(包含)选择器:
关键符:空格
作用对象:指定标签元素下的后辈元素
如:css中: #rebook li{}html中:<ul id="rebook">
<li></li>
</ul>
区别:>作用于元素的第一代后代,空格作用于元素的所有后代。
【2】CSS伪类:
a:link{},定义正常链接的样式;
a:visited{},定义已访问过链接的样式;
a:hover{},定义鼠标悬浮在链接上时的样式;
a:active{},定义鼠标点击链接时的样式。
【3】CSS中不可继承的属性:
display、margin、border、padding、background、height、min-height、max-height、width、min-width、max-width、overflow、position、left、right、top、 bottom、z-index、float、clear、table-layout、vertical-align、page-break-after、 page-bread-before和unicode-bidi...
【4】CSS样式权值规则:
标签的权值为1,类选择符的权值为10,ID选择符的权值最高为100。
p{color:red;} /*权值为1*/
p span{color:green;} /*权值为1+1=2*/
.warning{color:white;} /*权值为10*/
p span.warning{color:purple;} /*权值为1+1+10=12*/
#footer .note p{color:yellow;} /*权值为100+10+1=111*/
注意:还有一个权值比较特殊--继承也有权值但很低,有的文献提出它只有0.1,所以可以理解为继承的权值最低。
!important加在“{;}”(分号之前)可以使该样式权值最大