ホームページ > 記事 > ウェブフロントエンド > CSSセレクターとは何ですか
各 CSS スタイル定義は、「セレクター {style}」の形式の 2 つの部分で構成されます。「{}」の前の部分が「セレクター」です。 「セレクター」は、「{}」内の「スタイル」のオブジェクト、つまり「スタイル」が Web ページ内のどの要素に作用するかを指定します。
このチュートリアルの動作環境: Windows 7 システム、CSS3&HTML5 バージョン、Dell G3 コンピューター。
CSS を使用して HTML ページ内の要素を 1 対 1、1 対多、または多対 1 で制御するには、CSS セレクターを使用する必要があります。 HTML ページの要素は CSS セレクターを通じて制御されます。
各 CSS スタイル定義は 2 つの部分で構成され、形式は次のとおりです: selector{style}
、{}
より前の部分は「セレクター」です。 「セレクター」は、{}
の「スタイル」のオブジェクトを指定します。つまり、「スタイル」が Web ページ内のどの要素に作用するかを指定します。
次に、画像を見てみましょう。上記の定義を具体的に分析したものです。
図に示すように、次のことがわかります。
{} より前の部分は「セレクター」であり、「セレクター」は要素を指定します。 in {} 「style」のオブジェクト、つまり、Web ページ内のどの要素が「style」の影響を受けるか。
セレクターは通常、スタイルを変更するために必要な HTML 要素です。 p>,
,< ;h1>Waiting各形式宣言文は「属性名:属性値」の組で構成され、属性名と属性値はコロンで区切られます。英語では「;」の前にセミコロンが付きます。
CSS セレクターとは何かを紹介した後、CSS セレクターにはどのような種類があるのかを見てみましょう。
CSS セレクターにはどのような種類がありますか?
CSS セレクターには多くの種類があります。CSS セレクターの種類を見てみましょう
1. タグ セレクター (body、div、p、ul、li など) )。
2. クラス セレクター (class="head"、class="head_logo" など)。
3. ID セレクター (id="name"、id="name_txt" など)。
4. グローバル セレクター (* など)。
5. 組み合わせセレクター (.head .head_logo など、2 つのセレクターはスペースバーで区切られていることに注意してください)。
6. セレクターを継承します (例: div p、2 つのセレクターはスペースバーで区切られていることに注意してください)。
7. 疑似クラス セレクター (例: リンク スタイル、要素の疑似クラス、4 つの異なる状態: リンク、訪問済み、アクティブ、ホバー)。
8. 文字列マッチング用の属性セレクター (^ $ * 3 種類、それぞれ開始、終了、包含に対応)。
推奨チュートリアル: CSS ビデオ チュートリアル
以上がCSSセレクターとは何ですかの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。