在CSS中，變量是一種強大的功能，它允許我們創(chuàng)建可重用的值，并在整個樣式表中輕松引用這些值，使用CSS變量，我們可以提高樣式表的靈活性和可維護(hù)性。

要創(chuàng)建CSS變量，我們需要使用var()函數(shù)，并將變量的名稱作為參數(shù)傳遞給它，我們可以創(chuàng)建一個名為color的變量，并將其值設(shè)置為red：

:root {
  --color: red;
}

在樣式表中，我們可以使用var()函數(shù)引用這個變量，我們可以將元素的背景顏色設(shè)置為color變量的值：

div {
  background-color: var(--color);
}

這將使div元素的背景顏色變?yōu)榧t色。

除了簡單的賦值外，我們還可以使用CSS變量來存儲復(fù)雜的計算或樣式規(guī)則，我們可以創(chuàng)建一個變量來存儲一個復(fù)雜的顏色梯度：

:root {
  --color-gradient: linear-gradient(to right, red, orange, yellow, green, blue, indigo, violet);
}

我們可以使用這個變量來設(shè)置元素的背景顏色：

div {
  background: var(--color-gradient);
}

這將使div元素的背景顏色呈現(xiàn)出一個從紅色到紫色的漸變效果。

CSS變量是一種非常強大的功能，可以讓我們更加輕松地管理和維護(hù)樣式表，通過創(chuàng)建可重用的變量，我們可以避免重復(fù)編寫相同的樣式規(guī)則，并使樣式表更加簡潔、易于理解。