CSS擬似クラスとは

css 疑似クラスは、要素の特別な状態を定義するために使用されます。次の目的で使用できます: 1. マウスが要素上にあるときにスタイルを設定する; 2. 訪問済みリンクと訪問していないリンクに異なるスタイルを設定する; 3. 要素がフォーカスを取得したときにスタイルを設定します。

#この記事の動作環境: Windows 7 システム、css3 バージョン、Dell G3 コンピューター。

疑似クラスとは何ですか?

疑似クラスは、要素の特別な状態を定義するために使用されます。

たとえば、次の目的で使用できます。

• マウスが要素上にあるときのスタイルを設定します。

• 訪問済みです 未訪問のリンクから異なるスタイルを設定します

• 要素がフォーカスを取得したときにスタイルを設定します

構文

疑似クラスの構文:

selector:pseudo-class {
  property: value;
}

アンカー疑似クラス

リンクはさまざまな方法で表示できます:

インスタンス

/* 未访问的链接 */
a:link {
  color: #FF0000;
}
/* 已访问的链接 */
a:visited {
  color: #00FF00;
}
/* 鼠标悬停链接 */
a:hover {
  color: #FF00FF;
}
/* 已选择的链接 */
a:active {
  color: #0000FF;
}

注意: a:hover を有効にするには、CSS 定義の a:link および a:visited の後になければなりません。 a:active を有効にするには、CSS 定義の a:hover の後になければなりません。疑似クラス名は大文字と小文字を区別しません。

疑似クラスと CSS クラス

疑似クラスは CSS クラスと組み合わせて使用​​できます:

例のリンクにマウスを移動したとき色が変わります:

Example

a.highlight:hover {
  color: #ff0000;
}

推奨される学習: 「css ビデオ チュートリアル 」

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