INSIGHT

インサイト

2014年123

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

話題になっていた良記事をまとめてみた。イマドキ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形式で書く