HTMLのハイパーリンクの色を変更する方法

王林
リリース: 2023-05-29 16:01:07
オリジナル
7270 人が閲覧しました

HTML 内のハイパーリンクは次のように記述されます:

<a href="链接URL">链接文本</a>
ログイン後にコピー

ハイパーリンクは CSS を通じてスタイル設定できます。このうち、ハイパーリンクの色はCSSのcolor属性を使用して設定できます。

スタイル シートのハイパーリンク スタイルは、すべてのハイパーリンクの色をグローバルに変更できます:

a {
  color: #0000FF; /* 设置超链接颜色为蓝色 */
}
ログイン後にコピー

または、特定のハイパーリンクのみの色を変更できます:

a.link-class {
  color: #FF0000; /* 设置类为link-class的超链接颜色为红色 */
}
ログイン後にコピー

変更したいハイパーリンクのスタイルについては、次の CSS ルールを使用できます。

a:link {
  color: #0000FF; /* 设置超链接未访问时的颜色为蓝色 */
  text-decoration: none; /* 去掉下划线 */
}

a:hover {
  color: #FF0000; /* 设置鼠标悬停时的颜色为红色 */
  text-decoration: underline; /* 增加下划线 */
}
ログイン後にコピー

上記のルールのうち、:link 疑似クラスは未訪問のリンクを表し、 :hover 擬似クラスは、ホバー時のマウスリンクを表します。リンクの色やスタイルをさまざまな状態に設定することで、より自由で多様な効果を実現できます。

最後に注意すべき点は、HTML でハイパーリンクの色を設定する場合、スタイル コードを <head> タグ <style>## 内に配置する必要があることです。ハイパーリンクの タグ内で直接ではなく、# タグまたは別の CSS ファイルを使用します。

以上がHTMLのハイパーリンクの色を変更する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート