話題になっていた良記事イマドキCSS設計をまとめてみた。

＜用語の定義＞
・Block
・Block内の要素Element
・BlockやElementの状態などを表すModifier

＜命名規則＞
・単語の区切りは"-"
・レイアウト的にBlockの中にBlockを設置するのはOK
・CSSの命名規則上はBlockを入れ子にするのはNG。必ず入れ子のBlockでもCSS上は独立して設計
・Elementには必ず所属するBlock名記述する
・BlockとElementは、"__"でつなぐ
・Modifierには接頭語に所属する場所(BlockまたはElement)を記述する
・状態(key)と状態(value)の値は、"_"1つでつないで、key_value形式で書く