BEMという命名規則とSass 3.3の新しい記法 - アインシュタインの電話番号

BEMを使った命名がとても明快で、このところHTMLやCSSを書くのによく使っている。CSSのクラス名として書く場合は、BEMをCSS用に使いやすくしたMindBEMdingという書き方を採用している。最初にこれを知ったときは「こんな汚い記述の仕方は使いたくない」と思ってたんだけど、すっかり慣れて、今ではその明快さにちょっと心酔しかけているほど。 BEMの方法論とMindBEMdingのルールについてはそれぞれの文書を読んでもらうとして、それらをひっくるめて大雑把に説明すると、BEMとはBlock、Element、Modifierの頭文字を取ったもので、構成する要素をそのどれかに当てはめて命名していく方法。どの場合でも必ずBlockもしくはそのModifierがルートにあり、その中に、所属するElementもしくはそのModifierが含まれる構成になる。 Block - 構成のルートとな

[nyanzou4649]

人間になりたい

[ruedap]

BEMについて書いたらずいぶん長くなってしまった

[suginoy]

妖怪人間

[nabetama]

“block__element--modifier ”

[comet30ch]

エウレカダイアリー

[hidemail]

“人的な考えだけど、どちらかと言えばBEMはシングルクラスに適した構造・命名だと思っていて、モジュール組み（さらに詳細な有料記事）などもこの系統に近い。逆に、マルチクラスにはOOCSSやSMACSS（書籍）などが向いて

[suthio]

BEM使う

[borne]

わかりやすいな

[nakagaw]

“@at-root”

[koheisg]

sass3.3ベースのフレームワークってなんだろ

[blueday]

へー。

[kzms2]

BEM（MindBEMding）についてとても丁寧に解説してある。色々見たけど広義の意味でわかりやすい。ステキ。

[the_zombis]

BEMを進化？させた感じ

[iR3]

ふむふむ「BEMとはBlock、Element、Modifierの頭文字を取ったもので、構成する要素をそのどれかに当てはめて命名していく方法。」

[kuwalab]

BEM

[d_animal141]

BEMという命名規則とSass 3.3の新しい記法

[masuP]

見た目であかんかったけど使い出すとええのか

[wakuworks]

設計（名前決めのルール化、スタイルの管理など）を楽に出来る。ただし、出来上がった HTML, CSS の肥大化は避けられないし、ソースの読み易さは損なわれている様に感じる。

[barlog]

Block Element Modifier. 素晴らしい。

[sue445]

みてる

[site159]

「MindBEMdingは、そのBEMをCSSのクラス名に適用するために作られた規則で、CSS界隈でBEMと言った場合はこのMindBEMdingを指すことが多い。Elementをアンダースコア2つ(__)、Modifierをハイフン2つ(--)で連結することでBEMの各要素を表現

[sionsou]

BEM化という単語を初めて知った…最近の技術の流行についていけてない

[lotus_tribal]

ワロタそして本当にこの通りの拒絶反応でた今ｗ→“この記号の使い方は初めて見ると強烈で人によっては拒絶反応が起きるタイプのもので、前述の元記事でもUuuugly!とディオ並みに叫んでいる。”

[kangsungyang03]

3.3て機能盛りだくさんだな～。

[deg84]

BEMは気持ち悪いんだけど代替案も思いつかない…

[itakura26]

BEMってなんだ？

[nilab]

BEMという命名規則とSass 3.3の新しい記法 - アインシュタインの電話番号

[haru135]

“BEM-Methodology Definitionsの日本語訳”

[jiskay]

初めてみたときは面食らったけど慣れるとわかりやすいらしい（まだ自分は慣れない）

[oki448jp]

BEMという命名規則とSass 3.3の新しい記法

[field_combat]

見た感じすごく拒否りたくなる。一回、試してみないとわからんな

[murasaki11]

BEMおぼえておこ。

[uniq]

そのまま使うのは難しいけど、参考になりそう