求職者支援訓練Webデザイン Webサイト制作科 白描

求職者支援訓練Webサイト制作科 補足メモ Web白描

Sass - ネストを記述

ルールのネスト(Nested Roles)

  • 入れ子構造を使うとクラス名の変更が楽になります
  • 子孫の関係をシンプルに記述することができます


《index.html》

f:id:web-0220:20180927191732p:plain


《style.scss》

f:id:web-0220:20180927191907p:plain


《style.css

f:id:web-0220:20180927192025p:plain

@media のネスト

《style.scss》

f:id:web-0220:20180927193515p:plain


《style.css

f:id:web-0220:20180927193833p:plain