CSSに関するmetabeeのブックマーク (2)

  • 「Compass」、基礎から応用まで! | 株式会社LIG

    こんにちは、デザイナーの王です。 今回の記事ではCompass使いになるための必要最小限の知識から応用まで、体系的にひと通り紹介していきます。 全くの初心者でも問題ありません! はじめに結論を言うと、CompassでCSSを書くと 早い! 見やすい! メンテしやすい! コード量がぐっと減る! 一度使い出したら最後、もう元には戻れない! 一体どこまで便利なのかずらずら書くよりも、百聞は一見にしかず! 簡単なプロジェクトを通して、各特徴について紹介した短いデモ動画を用意したので、まずはこちらを見てください! Compassとは? Compassを語る前に、まずは「Sass」を知っておく必要があります。なぜなら、CompassはSassを元に開発したフレームワークだからです。 Sassとは では「Sass」とは何かと言うと、正式名称は「Syntactically Awesome Style Sh

    「Compass」、基礎から応用まで! | 株式会社LIG
  • BEMの考え方を基にしたHTML / CSSのid・classの命名規則 - Qiita

    概要 id・classの命名規則についてはGoogleのガイドラインや、BEMがあることで、ある程度指標ができておりますが、仕事で使うガイドラインを制作するにあたって、どのような形が望ましいのか、考えなおそうと思い、色々情報を集めていました。 BEMの考え方が個人的に良かったので、採用しようと思ったのですが、BEMは少し冗長になりがちなので、個人的にはそこを改善したいのと、無駄になりそうな要素はなるべく減らして行きたかったので、BEMの考え方を基に少しカスタマイズして、命名規則を思案しました。 BEM 記事も揃っておりますので、ここには特筆はしません。 簡単な説明のみとさせていただきます。 BEMとは? 「Block」「Element」「Modifier」の頭文字。BEM(ベム)と呼びます。 Block / 構成のルートとなる親要素。 Element / Blockに付随する子要素。 Mo

    BEMの考え方を基にしたHTML / CSSのid・classの命名規則 - Qiita
  • 1