CSS の書き方の原則_html/css_WEB-ITnose

1.css セレクター

CSS セレクターの記述方法によって、ブラウザーが実行する必要がある一致の数が決まります。また、特定の種類の CSS セレクターではブラウザーがより多くの一致を試行するため、単純なセレクターよりもオーバーヘッドが高くなります。

ID セレクター

このタイプのセレクターはシンプルかつ効率的で、ページ上の固有の要素を照合するために使用されます。 #id {}

クラス selector.className {}

型セレクター tagName {}

隣接兄弟セレクター H1 + #toc {}

子セレクター #toc > li {}

子孫選択記号 #toc A { }

ワイルドカード セレクター * {}

属性セレクター [href="#index"] {}

疑似クラスと疑似要素 A:hover {}

効率的な CSS セレクターの鍵

1) 右端の優先順位

実際、CSS セレクターは右から左に照合されます。

2) 効率的な CSS セレクターを作成します

ワイルドカード ルールの使用を避けます: ID セレクターとクラス セレクターのみを使用します

ID セレクターを制限しないでください: ID セレクターの左側に他のセレクターを追加する必要はありません

禁止クラス セレクターを制限する : クラス セレクターを修飾するために特定のラベルを使用せず、実際の状況に応じてクラス名を拡張します。 具越 ルールはより具体的であるほど良いものにしましょう

子孫選択ルーンの使用を避けてください

子選択を行うためにラベルを使用しないでください。