ホームページ >ウェブフロントエンド >CSSチュートリアル >a タグの CSS スタイルの 4 つの状態

a タグの CSS スタイルの 4 つの状態

不言
不言オリジナル
2018-06-12 11:17:204407ブラウズ

この記事では、a タグの CSS スタイルの 4 つの状態を主に紹介します。これには、必要な友達が参照できるように共有します。

a の 4 つの「状態」のシーケンス。タグ: a:link ->a:hover ->a:active ->a:visited です。さらに、a:active はアンダースコアの有無にかかわらず設定できません (アンダースコアは常に存在します)

は、a{color:red} などのすべての状態の接続を表します。 ① a:link: 未訪問のリンク。 a:link {color:blue} など。
② a:visited: 訪問済みのリンク。 a:visited{color:blue} など。
③ a:active: 訪問中のリンクの色。 a:active {color:blue} など、アクティブ化 (リンクがフォーカスされたとき)
④ a:hover: a:hover {color:blue} など、マウスがリンク上に移動したとき
通常、ステータス (color a:hover リンクと a:visited リンクの (、下線など) は同じである必要があります。
最初の 3 つは、それぞれ body 要素の link、vlink、および alink 属性に対応します。
4 つの「状態」の順序は次のとおりです: a:link ->a:hover ->a:active ->a:visited。さらに、a:active は下線の有無にかかわらず設定できません (下線は常に存在します)。
例: 疑似クラスの共通ステータス値

<style type = “text/css”> 
a {font-size:16px} 
a:link {color: blue; text-decoration:none;} //未访问:蓝色、无下划线 
a:active:{color: red; } //激活:红色 
a:visited {color:purple;text-decoration:none;} //已访问:purple、无下划线 
a:hover {color: red; text-decoration:underline;} //鼠标移近:红色、下划线 
</style>

以上がこの記事の全内容です。その他の関連コンテンツについては、PHP 中国語 Web サイトをご覧ください。

関連する推奨事項:

CSS Borderのsolid属性の使い方の紹介

CSSマウス風カーソルの解説

以上がa タグの CSS スタイルの 4 つの状態の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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