CSS複合選擇器

複合選擇器是由兩個或多個基礎選擇器，通過不同的方式組合而成的,目的是為了可以選擇更準確更精細的目標元素標籤。

交集選擇器

交集選擇器由兩個選擇器構成，其中第一個為標籤選擇器，第二個為class選擇器或ID選擇器，兩個選擇器之間不能有空格.

p.類名{
        color：red;
        display:block
        }
標籤選擇器後面跟類名
p#id名{
        color：red;
        display:block
        }
 標籤選擇器後面跟ID名
<p class="類名">  </p>
<p ID="id名">  </p>
 

 交集選擇器可以看成數學上的交集,實際工作中用的較少

並集選擇器

並集選擇器是各選擇器通過逗號（,）連線而成,任何形式的選擇器都可以作為並集選擇器的一部分。當某些選擇器定義的樣式完全相同，或部分相同，就可以利用並集選擇器為它們定義相同的CSS樣式。

並集選擇器中所有選擇器都會執行後面樣式。 如上圖中.class,h3,div三個選擇器都會執行顏色為紅色。常用於多個選擇器相同的宣告。

後代選擇器

後代選擇器又稱為包含選擇器，用來選擇元素及元素的後代，其寫法就是把外層標籤寫在前面，內層標籤寫在後面，中間用空格分隔。當標籤發生巢狀時，內層標籤就成為外層標籤的後代。

.mi-top-bar a{
    height: 40px;
    color: #B0B0B0;
    line-height: 40px；
}

它能選擇任何包含在內的所有標籤，包括他的子孫後代。

子元素選擇器

子元素選擇器只能選擇作為某元素子元素的元素。其寫法就是把父級標籤寫在前面，子級標籤寫在後面，中間跟一個 進行連線。 

.mi-logo>p{
	position: absolute;
	top: 72px;
	left: 385px;
	height: 12px;
}

和後代選擇器對比可以看出子代選擇器只能選擇兒子類，他的孫子，重孫之類都不歸他管

偽類選擇器

偽類選擇器用於向某些選擇器新增特殊的效果。比如給連結新增特殊效果。

偽類選擇器用冒號（:）表示如：:link{ }    , a:hover{  }

連結偽類選擇器

• :link /* 未訪問的連結 */

• :visited /* 已訪問的連結 */

• :hover /* 滑鼠移動到連結上 */

• :active /* 選定的連結 */

a {   /* a是標籤選擇器  所有的連結 */
			font-weight: 700;
			font-size: 16px;
			color: gray;
		}
a:hover {   /* :hover 是連結偽類選擇器 滑鼠經過 */
			color: red; /*  滑鼠經過的時候，由原來的 灰色 變成了紅色 */
}