CSSカスタムプロパティ
#css #css変数
(MDN)
sass の変数と異なり、通常のプロパティと同じように子要素に継承される。
(解説は
CSS カスタムプロパティはパラメータの夢を見るか
僕がネイティブな CSS 変数にわくわくする理由
がわかりやすいのでそっちを読んでいただきたいです)
例
code:css
:root {
--main-bg-color: brown;
}
element {
background-color: var(--main-bg-color);
}
変数名は--で始める
変数名はcase sensitive
var()で値を参照できる
:root擬似クラスで宣言することで、文書全体に適用できる
必要な場所で参照する