ホームページ  >  記事  >  ウェブフロントエンド  >  CSS3のセレクターの構文は何ですか

CSS3のセレクターの構文は何ですか

php中世界最好的语言
php中世界最好的语言オリジナル
2017-11-30 12:00:563261ブラウズ

今日は 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 サイトの他の関連記事にも注目してください。

関連記事:

H5 で花火のパーティクルエフェクトを作成する方法

div 幅を適応させるためのチュートリアル

Web ページで h タグを使用した開発経験

以上がCSS3のセレクターの構文は何ですかの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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