CSSセレクターとはどういう意味ですか?

CSS では、セレクターはスタイルを設定する必要がある要素を選択するためのモードです。CSS セレクターは CSS スタイルのオブジェクト、つまり「スタイル」が Web ページ内のどの要素に作用するかを指定します。構文形式は「selector" {style}」です。 HTML ページの要素は CSS セレクターを通じて制御されます。

このチュートリアルの動作環境: Windows 7 システム、CSS3&&HTML5 バージョン、Dell G3 コンピューター。

CSS では、セレクターはスタイルを設定する必要がある要素を選択するためのモードです。

CSS を使用して HTML ページ内の要素を 1 対 1、1 対多、または多対 1 で制御するには、CSS セレクターを使用する必要があります。 HTML ページの要素は CSS セレクターを通じて制御されます。

各 CSS スタイル定義は 2 つの部分で構成され、形式は次のとおりです: [code] セレクター {style} [/code] {} より前の部分は「セレクター」です。 「セレクター」は、{} 内の「スタイル」のオブジェクト、つまり「スタイル」が Web ページ内のどの要素に作用するかを指定します。

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

#セレクター例例の説明..introclass="intro" を持つすべての要素を選択します。 ..name1.name2クラス属性を選択します。 name1 と name2 のすべての要素が含まれます。 ..name1 .name2クラス名 name1 として選択しますelement すべての classname name2 要素の子孫。 #firstnameid="firstname" の要素を選択します。 ## すべての要素を選択します。 pすべての

要素を選択します。

##element##element,すべての

要素を選択し、すべてを選択します

要素。

element

要素内のすべての < を選択します;p>要素。

##element>elementelement~element2[][target][=value][~=値][|=値]属性値]#[$=]a[href$=".pdf"]属性値a[href*="w3schools"]#:focusinput:focusフォーカスを取得する入力要素を選択します。 :fullscreen:fullscreen 全画面モードの要素を選択します。 :hovera:hoverマウス ポインターが置かれているリンクを選択します。 :in-rangeinput:in-range値が指定された範囲内にある入力要素を選択します。 :indeterminateinput:indeterminate不確定状態にある入力要素を選択します。 :invalidinput:invalid無効な値を持つすべての入力要素を選択します。 :lang()p:lang(it)「it」に等しい lang 属性を選択します(イタリア語) 各

要素。

class
class1.class2
class1 .class2
#id
element
.classp.intro	class="intro" < ですべて選択;p>要素。
elementdiv, p
elementdiv p
##div > p親要素が < すべてであることを選択してください div 内の要素>。		element
div p の直後の最初の要素を選択します。 要素。		element1
p ~ ul 要素に対して。		attribute
target 属性を持つすべての要素を選択します。		attribute
[target=_blank]ターゲットをすべて指定して選択="_blank" 属性を持つ要素。		属性
[タイトル~=花]タイトルを選択してください属性には、「flower」という単語を含むすべての要素が含まれます。		属性
[lang|=en]言語を選択属性値が「en」で始まるすべての要素。	#[	^=
a[href^="https"]src 属性値が「https」で始まるすべての 要素を選択します。	属性	値
src 属性が「.pdf」で終わるすべての 要素を選択します。 #[	*=	]
href 属性値に「abc」部分文字列が含まれる各 要素を選択します。 :active	a:active	アクティブなリンクを選択します。
::after	p::after	各 のコンテンツの後にコンテンツを挿入します。
::before	p::before	各 のコンテンツの前にコンテンツを挿入します。
:checked	input:checked	選択した各 要素を選択します。
:default	input:default	デフォルトの 要素を選択します。
:disabled	input:disabled	無効になっている各 要素を選択します。
:empty	p:empty	子要素を持たないすべての 要素 (テキスト ノードを含む) を選択します。
:enabled	input:enabled	有効な各 要素を選択します。
:first-child	p:first-child	親要素要素の最初の子要素である各 を選択します。
::first-letter	p::first-letter	各 要素の最初の文字を選択します。
::first-line	p::first-line	各 要素の最初の行を選択します。
:first-of-type	p:first-of-type	親に属する最初の 要素を選択します各 要素の要素。
language
:last-child	p:last-child	親要素の最後の子要素である各 要素を選択します。
:last-of-type	p:last-of-type	親に属する最後の 要素を選択しますelement 各 要素。
:link	a:link	未訪問のリンクをすべて選択します。
:not(selector)	:not(p)
:nth-child(n)	p:nth-child(2)	属する要素を選択してくださいその親へ 各 要素の 2 番目の子。
:n 番目の最後の子(n)	p:n 番目の最後の子(2)	同じ上記と同様に、最後の子要素から数えます。
:n 番目のタイプ(n)	p:n 番目のタイプ(2)	選択親の 2 番目の 要素に属する各 要素。
:n 番目の最後のタイプ(n)	p:n 番目の最後のタイプ(2)	上記と同じですが、最後の子要素から数え始めます。
:only-of-type	p:only-of-type	親に属する唯一の 要素を選択しますelement 各 要素。
:only-child	p:only-child	親要素の唯一の子要素である各 要素を選択します。
:optional	input:optional	「required」属性のない入力要素を選択します。
:out-of-range	input:out-of-range	値が指定範囲を超える入力要素を選択します。
::placeholder	input::placeholder	「placeholder」属性が指定されている入力要素を選択します。
:read-only	input:read-only	「readonly」属性を指定した入力要素を選択します。
:read-write	input:read-write	「readonly」属性を指定していない入力要素を選択します。
:required	input:required	「required」属性が指定されている入力要素を選択します。
:root	:root	ドキュメントのルート要素を選択します。
::selection	::selection	ユーザーが選択した要素の部分を選択します。
:target	#news:target	現在アクティブな #news 要素を選択します。
:valid	input:valid	有効な値を持つすべての入力要素を選択します。
:visited	a:visited	訪問済みのリンクをすべて選択します。

(学習ビデオ共有: css ビデオ チュートリアル)

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