CSS 變量（variable）是 CSS3 的新特性，允許開發(fā)者在 CSS 中聲明一個(gè)變量，然后可以在文檔中的任何地方使用名字來引用它們。現(xiàn)在，基本上所有的瀏覽器都支持 CSS 變量，可以通過MDN獲得更多信息。

CSS 變量可以大大簡化代碼，因?yàn)樗试S你使用一種變量一次定義多次使用的方式。你可以使用 CSS 變量來代替以前在 CSS 中使用的其他變量，包括字符串、數(shù)字和顏色值。

/* 以前的方法 */
.container {
color: #383838;
font-size: 16px;
background-color: #f5f5f5;
}
/* 使用 CSS 變量的方法 */
:root {
--text-color: #383838;
--font-size: 16px;
--background-color: #f5f5f5;
}
.container {
color: var(--text-color);
font-size: var(--font-size);
background-color: var(--background-color);
}

如上述代碼所示，通過在:root中定義 CSS 變量（變量的名字以--開頭），然后在元素樣式中使用var()函數(shù)引用變量，可以用 CSS 變量減少大量代碼。

需要注意的是，CSS 變量可以在現(xiàn)代瀏覽器中使用，但在過去的瀏覽器中可能不支持。如果你在使用一些舊版瀏覽器，可以使用其他方式來模擬出 CSS 變量。（例如，在 SASS 中可以使用變量，并在編譯過程中將其轉(zhuǎn)換為 CSS）。