CSSにはどのようなセレクターがありますか?

CSS のセレクターには、1. 単純セレクター、2. 属性セレクター、3. 組み合わせセレクター、4. 疑似クラス セレクター、5. 疑似要素セレクター、6. 複数セレクターが含まれます。

# この記事の動作環境: Windows 7 システム、CSS3 バージョン、Dell G3 コンピューター。

一般的な CSS セレクターとは何ですか?

1. 単純なセレクター

セレクター意味E.info##footerid ​​セレクターは、id 属性が footer2 と等しいすべての要素に一致します。セレクター

##ユニバーサル要素セレクター、任意の要素に一致
タグ セレクター、E タグを使用するすべての要素と一致します
クラス セレクター、クラス属性内の情報を含むすべての要素と一致します

セレクター意味[atrr]attr の値に関係なく、attr 属性を含むすべての要素を選択します。#[attr=val][attr=val] attr 属性を持つすべての要素のみを選択しますは val3 に割り当てられます。

#A、BA または/および B に一致する要素を選択しますA B子孫を選択しますB に一致し、A に一致する要素 (A と B はスペースで区切られます)#A B #A ~ BB に一致し、A に一致する要素である次の N 個の隣接する要素を選択します4. 疑似クラスセレクター意味a:link

##A > B	B に一致し、直接の子要素である要素を選択しますA
#B に一致し、A に一致する次の要素である要素を選択します。 隣接する要素

クリックされていないリンクをすべて一致させる

a:visitedクリックされたすべてのリンクと一致しますa:hovera 要素と一致します。マウスが a:active の上にマウスを置いています。 マウスが押されているが離されていない a 要素と一致します li:first-child は親要素の最初の子要素と一致します lili:last-child 最後の子要素と一致します親要素の要素 li 親要素の n 番目の子要素 ​​li と一致します (奇数、偶数) セレクター意味E 要素要素内に子を作成し、生成された内容を擬似要素として挿入し、先頭に置きます

	li:nth-child(n)
	#5. 疑似要素
	#E::before

E::afterE 要素内に子要素を作成し、生成されたコンテンツを擬似要素として末尾に挿入しますユーザーが強調表示している文書の部分 (マウスで選択した部分など) # 6. 複数のセレクター 複数のセレクター # in HTML では、同じタグに複数のクラス名を付けることがあります。

<p class="one two"></p>

.one .two{}    /*两个 class 中有空格*/
.one.two{}     /*两个 class 中沒有空格*/
.one, .two{}   /*两个 class 中出现逗号*/

one.two{ } の違いは何ですか? 、.one .two{ }.one、.two{ }最初の 1 つと 2 つの間にはスペースが含まれています。つまり、選択されるには 2 つ 1 つでなければならないことを意味します。

	E ::selection
E::first-letter	E 要素の最初の文字と最初の行の最初の文字が一致します
E ::first-line	最初の行と一致しますE 要素の
のようになります。CSS では、	のように複数のクラスを同時に選択できます。
、または	?

2 番目と 2 の間にスペースはありません。これは、特定のブロックが CSS によって選択される前に、1 つと 2 つのクラスの両方が必要であることを意味します。

3 番目と 2 にはカンマが含まれています。これは、クラスに 1 つまたは 2 つがある場合、それがエディターによって選択されることを意味します。

簡単に言うと、スペースがない場合は、選択するには同時に含める必要があることを意味します。スペースがある場合は、前のクラスに埋め込まれている場合に次のクラスが選択されることを意味します。カンマは、それのみを意味します。含める必要があるクラスの 1 つが選択されます。

[推奨学習: 「css ビデオ チュートリアル 」]

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