CSS中如何引用變量？ CSS變量（也稱為CSS自定義屬性）是CSS中的一項新功能，它允許在CSS中使用變量并將其應用于整個樣式表。 引用變量非常簡單，我們只需要聲明一個變量并將其引用到需要的地方。以下是一個基本示例：

:root {
--primary-color: #007fff;
}
p {
color: var(--primary-color);
}

在這個例子中，我們在:root選擇器中聲明了一個名為--primary-color的變量，其值為#007fff（深藍色）。然后，在p選擇器中，我們使用var()函數引用了這個變量作為p元素的文本顏色。 另一個有用的方面是變量可以在整個選擇器中重復使用，而不必多次定義。例如：

:root {
--primary-color: #007fff;
--secondary-color: #ffa500;
}
.button {
background-color: var(--primary-color);
color: #fff;
padding: 10px 20px;
border-radius: 5px;
}
.button:hover {
background-color: var(--secondary-color);
}

在這個例子中，我們聲明了兩個變量--primary-color和--secondary-color，然后在.button選擇器中使用了它們作為背景色和懸停顏色。由于變量的存在，我們可以在整個CSS樣式表中有效地使用變量并減少代碼的編寫。 總結 引用變量是CSS中的重要功能，允許我們在整個樣式表中重復使用值。使用變量可以提高代碼的可讀性和可維護性，同時還允許更快地更改樣式。如果你還沒有了解過CSS變量，請嘗試使用它，并看看如何通過這個方便的功能來簡化你的CSS代碼。