HTMLとCSSの基本記述

HTMLとCSSの基本記述 {
・CSSはクラスに記述する {
エレメントやタグではなくクラスに指定する。
HTMLエレメントにCSSをかくと打ち消しのためのCSSが増える
制限されたCSSをかくと再利用性が下がる
クラス名をわかりやすくする
}
・CSSプロパティはアルファベット順
・ HTMLタグとCSSのインデントは半角スペース2
・CSSのプロパティをまとめる
・色の16進トリプット表記は可能なら３桁表記に
・CSSのネストは孫まで
・CSSのレンダリング速度
・セレクタのマッチ数を減らすと高速に動作する
・CSSのセレクタは右から順に評価されるため、CSSの指定セレクタが多い場合は動作速度も遅くなる。
・ベンタープレフィックス {
・各ブラウザごとの草案段階の先行実装や、独自拡張機能であることを判断するための識別子のこと。
メリット {
・ベンダープレフィックス対応のブラウザで、CSSの最新機能を反映できる
}
デメリット {
・CSSの仕様が固まれば、不要になり廃止される場合がある。
・その場合、CSSファイルの中に不要なコードが残りCSSファイルを肥大化させる可能性がある。
}
}
・JavascriptからアクセスするIDとクラス {
JavascriptからIDもしくはクラスを利用する場合は、ブロック名の前に「js-」をつける。
js-がついたクラスは、CSSファイルには記述せず、デザインのスタイルを当てないようにする。
これはスクリプトとデザインで使用されているクラスを明確に分けるため
HTMl要素の中に、CSS用のクラスと、JSクラスを作成しておく。
}
・IDにスタイルを当てない {
IDはページ内で一つしあk使用できない
IDは詳細度の計算を複雑にする
ID経由で多重継承したCSSスタイルの継承は、複雑で難易度が高い
クラスよりもIDの方が詳細度が強いという理由でのみ、IDにCSSが書かれている現場がある。
}
・インラインスタイル使用不可 {
}
}