ホームページ >ウェブフロントエンド >フロントエンドQ&A >css3リンク擬似クラスとは何ですか?

css3リンク擬似クラスとは何ですか?

青灯夜游
青灯夜游オリジナル
2021-12-09 15:31:592699ブラウズ

CSS3 リンク疑似クラスは 5 つあります: 1. ":link"、訪問されていないリンクのスタイルを設定します; 2. ":visited"、これは訪問されていないリンクのスタイルを設定します。訪問済み; 3. ":hover"、リンク上でマウスをホバーするスタイルを設定します; 4. ":active"; 5. ":focus"。

css3リンク擬似クラスとは何ですか?

このチュートリアルの動作環境: Windows 7 システム、CSS3&&HTML5 バージョン、Dell G3 コンピューター。

CSS リンク擬似クラスとは何ですか?

css リンク疑似クラスは CSS の組み込みクラスであり、CSS 自体がリンクに特殊効果を追加する機能をいくつか提供します。

css リンク疑似クラスは、リンクに特殊効果を追加するために使用されます。

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

リンク用のいくつかの疑似クラス要素

  • :link--これを使用して未訪問のリンクのスタイルを設定します

  • :visited -- これを使用して、訪問したリンクのスタイルを設定します。

  • :hover -- これを使用して、マウスをホバーするスタイルを設定します。リンク Style

  • :active -- マウスがリンクをクリックしてからマウスが放されるまでのスタイルを設定するために使用されます

  • :focus -- スタイルの設定に使用されます。キーボードを使用してリンクにフォーカスするときのスタイル (タブ キーや上下キーを使用してページ フォーカスを移動する場合など)

#通常の未訪問のリンク

a:link {
    text-decoration: none;
}

すでに訪問したリンク

a:visited {
    text-decoration: none;
}

マウスが通過した (留まった)リンク

a:hover {
    text-decoration: none;
}

クリックされている、マウスが移動されていないリンク要素上でリリースされた

a:active {
    text-decoration: none;
}

フォーカスが得られたときにマウスを放したときに表示される色

a:focus {
    text-decoration: none;
}

(学習ビデオ共有:

cssビデオチュートリアル)

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

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