CSS セレクターの例の共有

現在、CSS のほとんどのセレクターに似ている jquery セレクターの使用方法を学んでいます。将来の比較と研究のために、CSS セレクターの概要を示します。 ： まず、要素セレクター: 元元 パターンセレクター:*{} は、一般的にブラウザー独自のグローバル除去効果に使用されます

タイプセレクター: E {} HTML タグ、通常、一部の一部を除去するために使用されます 特定のブラウザーに付属する効果

ID セレクター: #MyId {} は通常、特定の効果や名前付きの特別な領域を指定するために使用されます。 1 つの ID のみの特性を使用する方法を学びます

クラス セレクター: .myclass{} は主に特殊効果を設定するために使用され、クラスを使用して複数の特性を使用して Web ページをレイアウトします

2 番目、関係セレクター: F セレクターが含まれます: E f (ここでの記号はスペースであることに注意してください。関係セレクター) は、Web ページの効果時間を設定するときに長い間使用されてきました。現時点では、

を正確に見つけるために使用されていると理解しています。 注: にセレクターを含めます。場所によっては、サブクラス セレクターとも呼ばれます。ここでのサブクラスは、以下に示すように、どれほど深くネストされていても実装されます。 ‐ ‐ へこれは、親要素の次のレベルの子要素のみにすることができ、子の子要素にはできません要素。これを上記のサブクラス セレクターとは区別してください。隣接セレクター: E+F 別の要素の背後にある要素を選択し、その 2 つの要素が同じ親要素を持つ場合は、隣接兄弟セレクターを使用できます。 E 兄弟選択デバイス: E ～ F は、E 要素内のすべての兄弟要素 f を選択します。了 注: ここでは、開発では一般的に使用されない E を除くすべて同じ要素を選択します。

3 番目、属性セレクター: (使用頻度は低い)

属性セレクターの分類: E[att]、E[att="val"]、E[att~ ="val" ]、E[att^="val"]、E[att$="val"]

、E[att*="val"]
、E[att|="val"]

E [att]: att 属性を持つ E 要素を選択します

:att 属性と属性値が val に等しい E 要素を選択します

指定された E 要素が val に等しい単語のリスト。

val で終わる文字列の E 要素

E [att|="val"]: att を持つ E 要素を選択します。属性であり、属性値は val で始まりコネクタ「-」で区切られた文字列です。

概要: スペースには ~ を使用し、先頭と末尾には ^ と $ をそれぞれ使用し、包含には * を使用し、特殊な |
4 番目の疑似クラス セレクター: ( Focus 、いくつかの特別なレイアウト効果に使用されます) E: 訪問済み 訪問後のスタイル

E: ハイパーリンク上に置かれたときの HOver のマウス ( をよく使用します)
V E: マウスのクリックとリリースの間に発生したアクティブ イベント E: フォーカスが取得されたときにフォーカスが解放されます。 E:not() s セレクターを含まない要素 E に一致し、特定のイベントをキャンセルするために使用されます。セレクター

以来html では、ルート要素は常に html です。

要素Eノート：大量のコンテンツがあるときに使用する、特定の特殊効果を設定する

C E: Last-Child は、親要素の最後のサブ要素と一致します。 (ここで jquery で使用することを忘れないでください)

E: NTH-Child (n) 親要素と一致する n n 子要素 注: ここでは、偶数または奇数に従って文法設定を設定できます (基本的な)

E:nth- last-child(n) 親要素の下から n 番目の子要素 ​​E と一致します

O の最初の兄弟要素 E E: Last-OF-TYPE
同じクラス内の同じクラスの最後の兄弟要素と一致しますtype e

E: 同じタイプの中で唯一のものと一致するonly-of-type

Brother要素EE:nth-last-of-type 同じ型に一致します。 n 番目の兄弟要素 E

子要素のない要素 E に一致します。 注: 子要素がないだけでなく、また、有効にするために内部に表示されないものはありませんe：チェック済み（入力タイプが無線とチェックボックスの場合に使用）

。文字通りの意味は
。それは文字通り

e：ターゲットEe

5番目、pseudo-objectセレクター：一般的に使用されます：
::二重結腸が推奨される書き込み方法であり、単一のコロンはまだ適用されますC E :: SELECTION オブジェクト選択時の設定オブジェクト (通常、B、真剣な顔の特殊効果テキスト表示を表示するために使用されます。2 つのコロニーに注意してください)

E: first-line/e :: first-line 設定オブジェクト内部の最初の行のスタイル (書くのが面倒すぎて、とにかくあまり使いません。ヘルプドキュメントを参照できます)

E: FIRST-LTTER/E :: FIRSET-LTTER オブジェクトの最初の文字を設定します (これこの記事はよく使われていますが、明らかに今の市場ではあまり使われていません)

関連する推奨事項:

CSS セレクターの新しい使い方の詳細な説明

CSS セレクター フィールド解析の実装方法

CSSセレクターセレクターの詳しい解説

以上がCSS セレクターの例の共有の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。