選擇器分組

在原來的基礎上我們想將下面html 檔案中的檔案都設定成一樣的顏色,我們可以這麼乾: html:

<h1>php中文网</h1>
<h2>php中文网</h2>
<h3>php中文网</h3>
<h4>php中文网</h4>

css:

h1{
  color: cadetblue;
}
h2{
    color: cadetblue;
}
h3{
    color: cadetblue;
}
h4{
    color: cadetblue;
}

這樣就是下面的效果圖:

但是我們一般會這樣寫css:

h1,h2,h3,h4{
  color: cadetblue;
}

效果是一樣的,完全沒有變化:

這樣是不是減少了不少程式碼,這就叫做選擇器的分組. 下面我們要補充的知識就是通配符*. 要想達到與前面相同的效果,還有一種方式就是,用通配符.

*{  color: cadetblue;
}

這樣一來的話,如果沒有特定元素的設定,都會發生顏色的轉換.下面有同學就要提問了,要是我們不想全一樣,其中有幾個採用別的設置呢.

解決這個問題我們就只需要進行覆蓋就好.如果我們想讓最後一個標題變成黑灰色,那麼在後面加上下面這句就好:

h4{    color: darkslategray;
}

#這樣的話,我們就能看見下面的效果:

但是一般我們使用通配符的時候就是設定整個頁面的那邊據和外邊距.就像這樣

*{
    padding: 0px;
    margin: 0px;
}