CSS 變量是一項很有用的功能，它可以讓開發者更輕松地管理和修改樣式。

在 CSS3 中，引入了預定義變量，它們是一組可以直接使用的 CSS 變量。

這些變量可以幫助我們更加方便地設置樣式，例如設置字體、顏色等。

/* 使用預定義變量設置顏色 */
.btn {
color: var(--color-primary);
background-color: var(--color-secondary);
border-color: var(--color-tertiary);
}

在上面的示例中，我們使用 var() 函數來引用預定義的顏色變量。 可以看到，變量名稱以雙橫線（--）開頭，并具有描述性，例如 color-primary，color-secondary，color-tertiary。 通過使用預定義變量，我們可以更快地更新樣式，例如通過修改變量定義，而不必到處查找和修改 CSS 代碼。

預定義變量還可以幫助我們更好地組織 CSS 代碼，并提高代碼重用性。

總的來說，預定義變量是一個非常實用的 CSS 功能，可以顯著提高代碼的可維護性和可讀性。