CSS3のセレクターの構文は何ですか
今日は CSS3 でよく使われるセレクター構文を紹介します。構文は大きく 基本セレクター構文、階層セレクター構文、動的疑似クラスセレクター構文の 3 種類に分けられます。以下に詳しく説明させていただきます。
1. 基本セレクター構文
(1)* ワイルドカードセレクター ドキュメント内のすべての HTML 要素を選択します
(2)E 要素セレクター 指定されたタイプの HTML 要素を選択します
#id ID セレクター 指定された Any タイプを選択しますID 属性値 "id" を持つ要素の要素
.class クラスセレクター 指定されたクラス属性値 "class" を持つ任意の型の複数の要素を選択
selector1, selectorN Group Selector 各セレクターを一致させる要素セット
2,階層セレクター構文
(1)E F 子孫セレクター (セレクターを含む) 一致する F 要素を選択し、一致する F 要素は一致する E 要素に含まれます
( 2)E>F サブセレクターは一致する F を選択します要素に一致し、一致する F 要素が E 要素の子要素と一致する
(3)E+F 隣接兄弟セレクター 一致する F 要素を選択し、一致する F 要素は一致する E 要素の直後に位置します
( 4)E~F ユニバーサルセレクター 一致するF要素と一致するE要素の後にあるすべての一致するF要素を選択します
3、動的擬似クラスセレクター構文
(1)E:linkリンク擬似クラス セレクターは一致する E 要素を選択します。一致する要素はハイパーリンクとして定義されており、アクセスされていません。リンクの説明ポイントで一般的に使用されます
(2)E:visited リンク擬似クラス セレクターは、一致する E 要素を選択し、一致する要素はハイパーリンクで定義され、訪問済みです。リンク描画ポイントでよく使用されます
(3)E:active ユーザー動作セレクターは、一致する E 要素を選択し、一致する要素がアクティブになります。リンク ストロークとボタンでよく使用されます
(4)E:hover ユーザー動作セレクター 一致する E 要素を選択し、ユーザーのマウスは要素 E 上に留まります。 IE6 以下のブラウザは、a:hover
(5)E:focus のみをサポートします。 ユーザー動作セレクター 一致する E 要素を選択し、一致する要素がフォーカスを取得します
上記の紹介を読んだ後、あなたはこの方法をマスターしたと思います。などなど、とても興味深いですね。php 中国語 Web サイトの他の関連記事にも注目してください。
関連記事:
以上がCSS3のセレクターの構文は何ですかの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ホットAIツール

Undresser.AI Undress
リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover
写真から衣服を削除するオンライン AI ツール。

Undress AI Tool
脱衣画像を無料で

Clothoff.io
AI衣類リムーバー

AI Hentai Generator
AIヘンタイを無料で生成します。

人気の記事

ホットツール

メモ帳++7.3.1
使いやすく無料のコードエディター

SublimeText3 中国語版
中国語版、とても使いやすい

ゼンドスタジオ 13.0.1
強力な PHP 統合開発環境

ドリームウィーバー CS6
ビジュアル Web 開発ツール

SublimeText3 Mac版
神レベルのコード編集ソフト(SublimeText3)

ホットトピック









CSS では、border-image 属性を使用してレースの境界線を実現できます。 border-image 属性では、画像を使用して境界線を作成できます。つまり、境界線に背景画像を追加できます。背景画像をレース スタイルとして指定するだけで済みます。構文「border-image: url (画像パス) は、内側への画像境界線の幅。開始を繰り返すかどうか;"。

CSS では、ID セレクターの識別子は「#」です。特定の ID 属性値でマークされた HTML 要素に特定のスタイルを指定できます。構文構造は「#ID 値 {属性: 属性値;}」です。 ID 属性は一意であり、ページ全体で反復できません。ID 属性値は数字で始まってはなりません。数字で始まる ID は Mozilla/Firefox ブラウザでは機能しません。

:nth-child(n+3) 擬似クラス セレクターを使用して、位置が 3 以上の子要素のスタイルを選択します。具体的なコード例は次のとおりです。 HTML コード: <divid="container" ><divclass="item"> ;最初の子要素</div><divclass="item"&

コードが標準化されていないため、JavaScript セレクターが失敗します。解決策は、 1. インポートされた JS コードを削除すると、ID セレクター方式が有効になります。 2. 「jquery.js」を導入する前に、指定された JS コードを導入するだけです。

この記事では、Chrome 90からオーバーフローに追加された新機能「overflow:clip」を紹介しますので、これを利用すると簡単にオーバーフローの方向を制御することができます。

含まれていない。 CSS セレクターには次のものがあります: 1. HTML ページの要素名を通じて特定の HTML 要素を見つけるタグ セレクター; 2. HTML 要素の class 属性の値を通じて特定の HTML 要素を見つけるクラス セレクター; 3. ID セレクターHTML 要素の id 属性の値を通じて特定の HTML 要素を検索します。 4. ワイルドカード セレクター「*」は、カスタム要素を含むすべてのタイプのタグ要素を参照できます。 5. 属性セレクターは、HTML 要素の既存の属性名を使用します。特定の HTML 要素を見つけるための HTML 要素または属性値。

is および where セレクターの詳細な分析: CSS プログラミングのレベルの向上 はじめに: CSS プログラミングのプロセスにおいて、セレクターは不可欠な要素です。これにより、特定の基準に基づいて HTML ドキュメント内の要素を選択し、スタイルを設定することができます。この記事では、一般的に使用される 2 つのセレクター、つまり is セレクターと where セレクターについて詳しく説明します。その動作原理と使用シナリオを理解することで、CSS プログラミングのレベルを大幅に向上させることができます。 1. is selector is selector は非常に強力な選択肢です

初心者から上級者まで: is および where セレクターの使用スキルをマスターする はじめに: データの処理と分析のプロセスにおいて、セレクターは非常に重要なツールです。セレクターを使用すると、特定の条件に従ってデータセットから必要なデータを抽出できます。この記事では、読者がこれら 2 つのセレクターの強力な機能をすぐに習得できるように、is および where セレクターの使用スキルを紹介します。 1. is セレクターの使用 is セレクターは、与えられた条件に基づいてデータセットを選択できるようにする基本的なセレクターです。
