Layout

ページを構成するヘッダーやメインのコンテンツエリア、サイドバーやフッターといったプロジェクト共通のコンテナーブロックのスタイルを定義します。

FLOCSSではidも可でしたが、原則.l-という接頭辞を利用します。

例

<header class="l-header">
    <p class="l-header__logo">
        <img class="l-header__logo__image">
    </p>
</header>

scss/layout/_header.scss

.l-header {
    &__logo {
        &__image {
        }
    }
}