CSS中的變量（Variables）被引入到CSS3中，它允許開發者在CSS聲明中重復使用同一值，從而避免了代碼的冗余。下面我們就來看一下CSS變量的用法。 首先，我們需要使用關鍵字“--”定義變量。如下所示：

:root {
--color-blue: #3f51b5;
--font-size: 16px;
}

上面代碼表示定義了兩個變量，一個是藍色字體的顏色值，另一個是字體大小。 在CSS聲明中使用變量也很簡單，只需要使用var()函數即可。如下所示：

p {
font-size: var(--font-size);
color: var(--color-blue);
}

上面代碼表示將字體大小和顏色值分別用變量代替，使代碼更容易維護。需要注意的是，使用變量時必須要加上“var()”函數，否則代碼將不起作用。 另外，我們也可以繼承變量。如下所示：

:root {
--color-blue: #3f51b5;
}
.content {
color: var(--color-blue);
}
.header {
background-color: var(--color-blue);
color: #fff;
}

上面代碼表示“content”和“header”兩個類選擇器均繼承了“color-blue”的變量值。這樣使得代碼更具有可讀性和可維護性，并且可以同時修改多個元素的 CSS 樣式。 總結：CSS變量是一種強大的工具，可以使代碼變得更加易讀和可維護。它可以用于在整個 CSS 中使用相同的值，并且可以提高代碼的復用性和可讀性。