CSS基础-复合选择器,属性选择器

复合选择器

交集选择器 -->同时选择复合多个条件的元素，有元素选择器，以元素选择器开头。  

eg:            p.red{ }                                           选择的是： 类名为 .red 的 段落标签。

并集选择器-->同时选择多个选择器

eg:           one, p , #test {color: red;}              选择的是：  .one 和 p 和 #test 这三个选择器都会执行

后代选择器 (空格)-->选择指定元素后代的所有元素。

eg:           ul li{     }                                        

子选择器 (>)-->选择指定元素子元素的所有元素。

eg:           div>p{     }

相邻兄弟选择器 (+)-->选择紧跟在另一个元素后面的元素，且两者拥有相同的父元素   

eg:           ul+li{  }

通用兄弟选择器 (~)-->选择指定元素的同级元素的所有元素。

eg:           div ~ p{  }

伪类选择器：

用来描述一个元素的特殊状态，比如第一个元素，被点击的元素，鼠标移入的元素

一般以：开头

：first-child 第一个子元素

：last-child 第一个子元素

：nth-child(3) 选中第3个元素   n为0开始

伪类是根据所有元素进行排序的

：first-of-type  同类型中的第一个

eg:          ul>li:first-of-type

ul>li:not(:nth-child(3){

}

-->出去第三个以外的所有元素

属性选择器

[属性名] { }  -->选择含有指定属性的元素

[属性名=属性值] { }  -->选择含有指定属性和属性值的元素

[属性名^=属性值] { }  -->选择以指定属性值开头的元素

[属性名$=属性值] { }  -->选择以指定属性值结尾的元素

[属性名*=属性值] { }  -->选择任意部分包含该属性值的元素