SMACSS

SMACSS(スマックス)はOOCSSのコンセプトをベースにできた、フロントエンドに関するガイドラインです。

SMACSSのポイントはパターンを抽出しやすくするためにカテゴライズされていることです。

SMACSSで提案しているカテゴリは
・BASE
・Layout
・Module
・State
・Theme

・BASEは各要素のデフォルトのスタイルを定義します。例えばreset.cssなど各要素のスタイルをリセットするものなどBASEカテゴリに属します。
・LayoutはIDを用いて定義されるヘッダーやコンテンツ、サイドエリアやフッターなどといった構成の大枠へのルールです。
・Moduleではページを構成できるオブジェクトのカテゴリです。それはボタンや見出しなど再利用可能なものを指します。
・Stateは、状態を表すルールを指します。よく使われるものでいえば

.is-hidden{/*.is-hiddenといった要素を隠すためのdisplay:none;を適用させるためのクラスを作成*/
   display:none;
}

・Themeはテーマを切り替えられるような機能が求められるようなcssの時に考慮されるカテゴリです。
よくつかわ

admin

cl0606

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です