ツクメモ的、CSSの命名規則、BEM（ベム）の使い方決定版！ | ツクメモ - ウェブやアプリをツクるヒトのメモどうも、もりさんです。 すっかり月一更新となってしまいました。 以前、CSSの命名規則について考えるという記事を書きましたが、実際にBEMを使用してみて、すごく良かったので、まとめてみます。 CSSの命名規則について考える BEM（ベム）について CSSの命名規則の一つで、Block（ブロック）、Element（エレメント）、Modifier（モディファイア）の略です。 Elementの前には_（アンダーバー）二つ、Modifierの前には-（ハイフン）二つで区切って、class名をつけます。 .block__element--modifier{ ... } これらの区切り（セパレータ）は、必ずしも二つである必要はありません。 しかし、class名を見るだけで、BEMを利用していると分かるので、二つにした方が良いと、考えています。 それ以外、名前のつけ方には、特に難しいことはありません。
