CSS $變量是CSS3引入的一個新特性,也被稱為CSS自定義屬性。與常規變量不同的是,它們以兩個連字符(--)開頭,并且可以在所有選擇器類型中使用。該變量的值可以在樣式表中多次使用,并且可以被動態地更新。
:root { --main-color: #F44336; } p { color: var(--main-color); } .button { background-color: var(--main-color); }
在上面的代碼中,使用了CSS $變量--main-color作為主要色調,并在p和.button選擇器中多次使用。當--main-color的值在:root選擇器中更新時,它將自動更新所有使用該變量的元素的顏色。
使用CSS $變量可以大大簡化CSS代碼的管理和維護。它們使得樣式可以更容易地進行修改和調整,同時也提高了代碼的重復使用率。然而,需要注意的是,不是所有瀏覽器都支持CSS $變量,因此需要進行適當的測試和備用方案。
上一篇css 隱藏域
下一篇css %3e號的作用