タグ

ブックマーク / qiita.com/mrd-takahashi (1)

  • BEMを参考にしたCSS設計 - Qiita

    現時点でBEMによるCSS設計はベターだと思う。でもベストではない。 なにがベストに思わせないのかと言えば冗長的な命名方法。これだけ。 アンスコやらスラッシュが2連続くところが嫌すぎて困る。 というわけで。 BEMの命名方法をカスタマイズしてみる。 BEMの基設計 BEMとは Block ⇒ 塊 Element ⇒ 要素 Modifier(keyとvalueで表す) ⇒ 状態(変化) の事を言う。 BEM(ベム)と呼ぶようだが、某妖怪人間ではない。 参考:知っておきたいHTMLテンプレート設計法 - OOCSSの基 | CodeGrid BEMのお約束 BlockとElementの区切りはアンスコ2個(__) BlockまたはElementとModifierの区切りはハイフン2個(--) ModifierのKeyとValueの区切りはアンスコ1個(_) BlockやElementを2つ

    BEMを参考にしたCSS設計 - Qiita
    kathew
    kathew 2019/04/17
    キャメルケース使いたい需要に応えたカスタマイズ。個人的にはCSSでハイフン区切りする時は階層を示す(.item 下に .item-elemがある)意味を持たせる事もあるので、この改変には少し難色。冗長さが無い点は良いな
  • 1