CSS - var()

• トップ
• CSSリファレンス
• var()

概要

説明

独自定義した変数を参照します。下記の例では、:root で変数 --default-color を定義しています。var() で変数を参照します。declaration-value には、変数が未定義の場合のデフォルト値を指定します。Internet Explorer ではサポートされていません。

使用例

:root {
  --default-color: red;
}
.box {
  color: var(--default-color, blue);
}

<div class="box">
  This is Japan.
</div>

リンク

• https://drafts.csswg.org/css-variables/#using-variables
• https://caniuse.com/#feat=css-variables