@eachでページごとに背景画像を設定する【SCSS】

この記事はアフィリエイト広告を利用しています。
この記事は最終更新から1年以上経過しています。内容が古くなっているかもしれません。。

後から変更があってもループ用の変数を修正するだけでOK。背景画像以外にも応用可能。

$pages: page1, page2 page3, page4;
@each $page in $pages {
  .#{$page}-bg {
    background-image: url(../images/#{$page}-bg.jpg);
  }
}

※CSSのセレクタ名・画像名はご自由に。

この記事はお役に立てましたか?

はい

ブログランキング・にほんブログ村へ

コメントを残す