さまざまな CSS セレクターの詳細な紹介

1. 基本セレクター

1. * ユニバーサル要素セレクター、任意の要素に一致します

2. E タグセレクター、E タグを使用するすべての要素に一致します

3.クラス属性に情報を含む

4. #footer ID セレクター、ID 属性がフッター

と等しいすべての要素に一致します

2. 複数要素の組み合わせセレクター

5. 複数要素セレクター、すべての E 要素または F 要素に同時に一致します。E と F はカンマで区切られます

6. E F

子孫要素セレクター、E と F の間で、E 要素の子孫であるすべての F 要素に一致します。スペース

7. E > F

子要素セレクター、E 要素

のすべての子要素 ​​F に一致します。E + F

隣接要素セレクター、E 要素要素 F の直後のすべての兄弟要素に一致します。 3.

CSS 2.1 属性セレクター

9. E[att]

その値に関係なく、すべての E 要素と att 属性を一致させます。 (注: ここでは、「[cheacked]」のように E を省略できます。以下と同じです。)

10. E[att=val]

att 属性が「val」に等しいすべての E 要素と一致します 11. E[att~=val]

は、

att 属性に複数のスペースで区切られた値があり、そのうちの 1 つが「val」に等しいすべての E 要素と一致します 12 E[att|=val]

はすべての

att と一致します。複数の連続した値を持つ属性ハイフンで区切られた値、値のいずれかが「val」で始まる E 要素は、主に「en」、「en-us」、「en-gb」などの lang 属性に使用されます。 、など。

IV. CSS 2.1 の疑似クラス

13. E:first-child

は親要素の最初の子要素と一致します

14。クリックされていません

15. E:visited クリックされたすべてのリンクと一致します

16。E:active マウスが押されているが放されていないE要素と一致します

17。 E:focus は、現在のフォーカスを持つ E 要素と一致します

19。 E:lang(c) は、lang 属性が c に等しい E 要素と一致します。

5. CSS 2.1 擬似要素

20 は、E 要素

21 の最初の文字と一致します。

22. E:before in E 要素の前に生成されたコンテンツを挿入します

23. E:after

E 要素の後に生成されたコンテンツを挿入します

6. 兄弟要素の CSS 3 ユニバーサル セレクター

24. E ~ F E 要素の後の任意の兄弟 F 要素と一致します

7.

CSS 3 属性セレクター 25. E[att^="val"]

属性

att 要素E[att$="val"] 属性 att の値は「val」で終わります

27。 E[att*="val"] 属性 att の値には「val」が含まれます。文字列要素

8. CSS 3 のユーザー インターフェイスに関連する疑似クラス

28. E:enabled フォーム内のアクティブ化された要素と一致します

29。

30. E:checked は、フォーム内の選択された radio (ラジオ ボックス) または checkbox (チェックボックス) 要素と一致します

31。 E::selection は、ユーザーが現在選択している要素

と一致します。

9 親要素の n 番目の子要素、最初の番号は 1

34 E:nth-last-child(n)

は親要素の最後から n 番目の子要素と一致します、最初の番号は1

35. E:nth-of-type(n)

:nth-child() と似ていますが、同じタグ 36 を使用する要素のみに一致します。

:nth-last-child() に似ていますが、同じタグ 37 を使用する要素のみと一致します。 E:last-child は、親要素の最後の子要素と一致します。これは、

:nth-last と同等です。 -child (1)

38。E:first-of-type は、親要素の下で同じタグを使用する最初の子要素と一致します。これは、

:nth-of-type(1)

39 と同等です。 :last-of-type は、親要素の下で同じタグを使用している最後の子要素と一致します。これは、

:nth-last-of-type(1)

40 と同等です。親要素の下に 1 つ 子要素、:first-child:last-child または:nth-child(1):nth-last-child(1)

41 に相当します。一致する親要素の下にある同じ型 タグの唯一の子要素。:first-of-type:last-of-type または:nth-of-type(1):nth-last-of-type(1) と同等)

42. E: 空

子要素を含まない要素と一致します

10.

CSS 3 アンチ選択疑似クラス

43。 E: not(s) 一致は現在のセレクターのどの要素にも一致しません

11. :target

CSS 3 の疑似クラス

44. E:target をクリックした後の効果と一致します。ドキュメント内の特定の

「ID」

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