复合选择器与特性(九)

1.a标签

非多级导航直接用a标签, a里面不能再放块元素了, li里面还可以放多个块元素.

2.实现块元素居中

margin: 50px auto;      设置块元素的上外边距,左右边距自动.
line-height: 50px;      当文本的高度等于父块元素的高度的时候,文本垂直居中
text-align: center;      设置文本水平居中.

3.background写法注意

复合型写法的选择属性大于或等于3个的时候才用.

单例写法一般再3个以下的时候选用

3.a标签默认是有下划线

text-decoration: none;   把文本的样式设置成none,文本下划线就会自动清除

4.交集选择器

<div class="wrap"> 内容 1   </div>
<div>  内容2   </div>
<div> 内容3   </div>

如果我只想设置有 wrap类的div标签,那我可以这样使用选择器

div.wrap{}         使用交集选择器,比较高级的用法

.wrap{}            这也可以用

对于id类的,我们也可以这样使用,但平常都不会用.

5.并集选择器

并集选择器表示和的意思.

 .one, 
 p , 
 #test {color: #F00;}         表示.one 和 p  和 #test这三个选择器都会执行颜色为红色。  通常用于集体声明。

6.后代选择器 相对于类选择器,后代选择器推荐使用

后代选择器表示父标签下的子标签.通过父标签一级一级下,选择最后一个子标签

ul li p a{}          ul下的li,li下的p,p下的a标签
ul  li a{}           ul下的li,li下的a标签

尽量不要超过四个标签名,即三个层级. 选择层级的时候注意精准.

7.子代选择器

表示父标签的下一级,只能是下一级,最亲的哪一个.

.demo > h3{ }   表示.demo的下一级h3标签.

子代选择器的使用优先级 大于 后代选择器的使用优先级

8.css的特性

层叠型

一个标签可以拥有多个样式;

当做个选择器都是指向一个标签时,它的样式都会生效;

当样式属性设置重叠时,

同级情况下,后面的样式会优先显示,CSS显示会优先级生效;

不同级情况下,会按照权重顺序显示’

继承型

子标签会默认继承父标签的元素,子标签单独设置后会优先显示

font 系列 text系列 color系列