ホームページ  >  記事  >  ウェブフロントエンド  >  CSS疑似クラスとは

CSS疑似クラスとは

藏色散人
藏色散人オリジナル
2021-04-09 15:03:362052ブラウズ

CSS 疑似クラスは、セレクターの特殊効果を追加するために使用されます。既存の要素が特定の状態にあるときに、対応するスタイルを追加するために使用されます。この状態は、ユーザーの動作に基づいて動的に変化します。

CSS疑似クラスとは

この記事の動作環境: Windows7 システム、HTML5&&CSS3 バージョン、Dell G3 コンピューター。

例: ユーザーが指定された要素の上にマウスを移動すると、:hover を使用してこの要素の状態を説明できます。これは一般的な CSS に似ており、既存の要素にスタイルを追加できますが、スタイルは DOM ツリーで記述できない場合にのみ要素に追加できるため、それらは疑似クラスと呼ばれます。

疑似クラスは動的である可能性があり、ユーザーがドキュメントを操作するときに要素が疑似クラスを取得したり失ったりする可能性があるように感じられます。例外は、ドキュメント ツリーから推論できる「:first-child」と、ドキュメント ツリーから推論される場合がある「:lang」です。

その機能はクラスに似ていることがわかりますが、ドキュメントの外部での抽象化に基づいているため、疑似クラスと呼ばれます。

疑似クラスには次が含まれます::first-child、:link:、visited、:hover:、:active、:focus、:lang、:right、:left、:first

Pseudo class?

は CSS の組み込みクラスです。CSS 自体がいくつかの機能を提供します。つまり、class=... や id=... は必要ありません。もちろん、次のような属性の一部を変更することもできます: a:link{color:#FF0000;}

CSS の提案の多くはブラウザーでサポートされていませんが、次の 4 つがあります。ハイパーリンクで安全に使用できる疑似クラス。

  • :リンクは未訪問の接続に使用されます。

  • #: Visited は、すでに訪問済みの接続で使用されます。

  • : active は、フォーカスを受け取った (たとえば、クリックされた) 接続で使用されます。

  • :hover は、マウス カーソルが置かれる接続に使用されます。

【推奨学習:

css ビデオ チュートリアル

以上がCSS疑似クラスとはの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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