ホームページ  >  記事  >  ウェブフロントエンド  >  CSS3 複合セレクター_html/css_WEB-ITnose

CSS3 複合セレクター_html/css_WEB-ITnose

WBOY
WBOYオリジナル
2016-06-24 11:22:20909ブラウズ

... 親要素の下にあるすべての兄弟要素 b

3. 属性セレクター

指定された要素の属性または値の要素を取得するには、

[Attribute] ]: 「すべて」の要素を「指定された属性」と照合します。

要素 [属性] を使用して入力を取得します。 [属性]: 「指定された」要素を「指定された複数の属性」と照合します

;

要素 [attribute="value"]: 「指定された属性が値と等しい」と一致します。

要素 [attribute~="value"]: 「指定された属性に次の内容が含まれる」「指定された」要素と一致します。この値(独立語)";

要素 [attribute^="value"]: 「指定された属性が指定された値で始まる」場合に、「指定された」要素と一致します;

要素 [attribute*="value"]:

要素 [Attribute$="value"]: 「指定された属性が指定された値で終わる」場合の "specified" 要素と一致します。 value";

要素 [attribute!="value"]: 「指定された属性が値と等しくない」場合に、「指定された」要素と一致します;

目 4. ターゲット疑似カテゴリの HTML アンカー ポイント

は、現在のアクティビティのターゲット要素を選択するために使用されます。

5. 要素ステータス疑似クラス

主に、フォーム要素で使用される、無効、有効、選択された状態に一致します。無効なすべての要素に一致します

:enabled 有効なすべての要素に一致します

:checked 単一選択およびチェック選択に使用されます。

要素構造 (階層) から分割します。

使用用途: 最初の子要素、最後の子要素、子要素は含まれない、子要素が 1 つだけ含まれる場合子要素のない要素に一致します

:only-child 子が 1 つだけある要素と一致します

ul > li:nth-child(2n+1) {do something} //ul +1 (奇数) li 要素の 2n 番目の要素を選択するために使用されます

E:nth-of-type() のみをカウントします親要素で指定された特定の型の子要素。要素に複数の子要素型がある場合は、nth-of-type を使用すると便利です。

E:nth-last-of-type() の使い方は E:nth-of-type() と同じですが、違いは:nth-last-of-type() も最後の子から始まることです親要素の要素をカウントアップします。

li:nth-of-type(3) は、3 番目の li 要素のみを選択し、他の要素は無視されることをマークします

7. 疑似クラスを否定します

「テキスト」]){色:赤;}

N 入力: Not (: Last-child) {background: blue;}

8. 疑似要素セレクター

: 指定されたセレクターの最初の文字の first-ltter 選択と一致します。ユーザーの選択 Part; 选

:: SELECTION {background: #ccc; color: red} // 文字の背景色と文字色を書き換えてカスタマイズすることも可能ですが、注意が必要です。 ::selection は 2 つの属性のみを受け入れます。1 つは背景、もう 1 つは色です。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。