:root
css 偽類匹配文檔的根元素。
對於 HTML 來說, :root 表示<html>元素,除了優先級更高之外,與 html 選擇器相同。
非IE及ie8及以上瀏覽器都支持,在:root中聲明相當於全局屬性,只要當前頁面引用了:root segment所在文件,都可以使用var()來引用
var()
var()函數可以代替元素中任何屬性中的值的任何部分。var()函數不能作為屬性名、選擇器或者其他除了屬性值之外的值。(這樣做通常會產生無效的語法或者一個沒有關聯到變量的值。)

在聲明全局 css 變量時 :root 會很有用:
:root { --main-bg-color: pink; }
body { background-color: var(--main-bg-color); }
CSS中的 “var()” 和 “:root”_ArvinWoo-CSDN博客
