在CSS3中，引入了一種新的選擇器——:root選擇器。這個(gè)選擇器可以讓開(kāi)發(fā)者選擇文檔根元素，從而更靈活地定義 CSS 樣式。
在 HTML 中，文檔的根元素是<html>元素。在大多數(shù)情況下，我們?cè)O(shè)置樣式時(shí)都會(huì)直接選擇某個(gè)元素或特定 class 或 id 的元素，但是有時(shí)候我們需要給整個(gè)文檔的樣式進(jìn)行全局的控制，這時(shí)候我們可以使用:root選擇器。
:root選擇器的寫(xiě)法很簡(jiǎn)單，只需要在樣式表中添加以下代碼：
:root {
/* CSS 樣式 */
}然后在這個(gè)選擇器下面我們可以隨意地定義全局的樣式。比如下面這段代碼可以將全局的字體顏色設(shè)置為藍(lán)色：
:root {
color: blue;
}當(dāng)我們需要修改全局顏色時(shí)，只需要修改:root選擇器下面的樣式即可：
:root {
color: red;
}此外，:root選擇器還可以跟其他選擇器配合使用，比如：
:root .button {
background-color: green;
}以上代碼會(huì)選擇所有 class 名為button的元素，并將它們的背景顏色設(shè)置為綠色。
總之，:root選擇器是一個(gè)非常好用的選擇器，它可以幫助我們更靈活地定義全局樣式，讓我們?cè)陂_(kāi)發(fā)時(shí)更加方便。
下一篇css3vh