タグ

ブックマーク / www.culture27.com (1)

  • Sass(Scss) Memo: 変数 | Culture27

    今回は変数についてです。 $ から始めて、値はCSSと同じようにして設定します。 こんな感じ。 Scss $margin: 2em 0; // $margin に "2em 0" をいれて定義する。 h1 { margin: $margin; } CSS h1 { margin: 2em 0; } 変数はそれが記述された{}内でのみ有効になります。 どのCSSルールセットやmixinにも含まれない場合、どこでも使えるグローバルな変数になります。 こんな感じ。 Scss h1 { $margin: 2em 0; // ここで$marginを定義する。 margin: $margin; } p { margin: $margin; // ここでは使えない!コンパイル時にエラーになります。 } インターポレーション 変数はプロパティの値だけでなく、セレクター名やプロパティ名にも使うことができます

  • 1