タグ

ブックマーク / qiita.com/sueshin (1)

  • 脱・CSS無法地帯。FLOCSSで指針のある設計を。 - Qiita

    FLOCSSの導入事例の共有 2017年の6月にリニューアルした転職ナビ、 最も大変だった事の一つはFLOCSSの導入でした。 FLOCSS命名規則にMindBEMdingを採用 ファイル・ディレクトリ構成を定義 カスケーディングと詳細度の管理方法にも言及 という特徴をもった、CSS設計指針です。 FLOCSSのドキュメントは世に数有るけれども導入事例や知見がもう少し欲しかったなと。 こちらの記事では転職ナビがFLOCSSを導入した時のお話をさせていただきます。 そもそも「CSS設計ってなんやねん」って方は、手前味噌ではございますが、よろしければこちらの記事をどうぞ。 CSS設計を勉強するならまずこれを見たら良いかも CSS設計で解決したかった課題 そもそも転職ナビのCSS設計を再定義することで解決したかった課題は2つあります。 オレオレになりがちな命名規則 プレフィックス

    脱・CSS無法地帯。FLOCSSで指針のある設計を。 - Qiita
    kyompi
    kyompi 2019/08/16
    “.modal__header--blue__btn--red__text--small {}”BEMだとこんな名前はつけられないんじゃない?
  • 1