CSS使用Vue變量的好處在于可以輕松地在組件之間共享變量，使得CSS更易于維護和修改。下面我們將詳細介紹CSS如何使用Vue變量。

// 定義Vue變量：$color-primary
:root {
--color-primary: #007aff;
}
// 使用Vue變量
p {
color: var(--color-primary);
}

在上面的代碼中，我們先定義了一個Vue變量 $color-primary，并將其賦值為 "#007aff"，這里我們使用了CSS變量的語法 ":root { --color-primary: #007aff; }"。

接著，我們在p標簽中使用了變量，語法為：color: var(--color-primary); 這里的 var 函數就是用來引用變量的。

需要注意的是，在使用Vue變量時，需要使用 var 函數，以避免代碼中硬編碼顏色值，降低了代碼的可維護性。同時，Vue變量的值可以動態改變，使得CSS的樣式隨著組件的狀態而變化。

綜上，CSS使用Vue變量是一個強大的工具，可以讓CSS更易于維護和修改，并能夠讓CSS的樣式可根據組件狀態的變化而變化。