ホームページ ウェブフロントエンド CSSチュートリアル CSS マウスホバー色の変更: マウスホバー時にハイパーリンクフォントの色が変わります

CSS マウスホバー色の変更: マウスホバー時にハイパーリンクフォントの色が変わります

Nov 22, 2018 pm 05:30 PM
変色 変化


#この記事の内容は、CSS マウスホバーの色の変更に関するものです。ハイパーリンクのフォントはマウスホバーの色に応じて変化します。特定の参照値があります。困っている方は参考にしていただければ幸いです。

css は、ハイパーリンク上にマウスを置くと色が変わるようにフォントを設定し、マウスをハイパーリンク上に置くと色が変わるようにレイアウトを設定します。

マウスをフォント上に置くとテキストの色が変わります。通常、ハイパーリンクのアンカー テキストのフォント色の変更には、疑似クラス: hover が使用されます。

a{ color:#00F}
a:hover{ color:#F00}
ログイン後にコピー

説明: デフォルトのハイパーリンクのフォントの色は青「color:#00F」で、マウスがホバーしているときのフォントの色は赤「color:#F00」になります。マウス ホバーの色を変更するには、a:hover

1、div CSS サンプル コード

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>鼠标悬停颜色改变 实例</title>
<style>
a{ color:#00F}/* 默认超链接字体颜色为蓝色 */
a:hover{color:#F00}/* 默认超链接字体悬停时颜色为红色 */
.zhiding a{ color:#090}
.zhiding a:hover{ color:#F0F}
</style>
</head>
<body>
<p>欢迎来到<a href="http://www.php.cn/">php</a>学习php技术!</p>
<p class="zhiding">指定对象<a href="#">超链接</a>字体悬停颜色改变!</p>
</body>
</html>
ログイン後にコピー

を設定するとわかります。効果は次のとおりです。

CSS マウスホバー色の変更: マウスホバー時にハイパーリンクフォントの色が変わります

手順 :

1)、デフォルトの Web ページのハイパーリンク フォントを青に設定し、マウスがホバーしているときは赤に設定します (a{ color: #00F} a:hover{color: #F00) });

2) また、指定されたオブジェクトのハイパーリンクのフォントの色をデフォルトで緑色に設定し、マウスがホバーしているときのフォントの色をピンクに設定します。

3. 概要

css マウスホバーの変色 ハイパーリンク疑似クラス「:hover」を適用して、CSS スタイルの変更に加えて、マウスホバーのフォント サイズとフォントも定義できます。太字、背景、その他のスタイルを変更し、他の CSS スタイルを柔軟に使用してフォントの色を変更します。

上記は、CSS マウス ホバーの色の変更の実装の完全な紹介です。マウス ホバーでハイパーリンク フォントの色が変わります。CSS3 チュートリアル について詳しく知りたい場合は、注意してください。 PHP中国語ウェブサイト。



以上がCSS マウスホバー色の変更: マウスホバー時にハイパーリンクフォントの色が変わりますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

AI Hentai Generator

AI Hentai Generator

AIヘンタイを無料で生成します。

ホットツール

メモ帳++7.3.1

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

SublimeText3 中国語版

中国語版、とても使いやすい

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

SublimeText3 Mac版

神レベルのコード編集ソフト(SublimeText3)

win10で白黒モードに切り替えるキーボードショートカットは何ですか? win10で白黒モードに切り替えるキーボードショートカットは何ですか? Jan 10, 2024 pm 01:26 PM

Microsoft がリリースした win10 システムには、以前のバージョンと比較して多くの新機能が追加されており、たとえば、カラー フィルターのショートカットであるカラー フィルターを使用して、win10 の全体的な表示を白黒に変更できます。このエフェクトの設定方法を知らない友人もいるかもしれません。それでは、今教えてください。お役に立てば幸いです~ win10を白黒に変更するショートカットキーの解決策は何ですか? 1. ショートカット++を使用してカラーフィルターをオンまたはオフにできます 2. カラーを完全にオフにしたい場合フィルターを使用するには、タスク バーのスタート ロゴを右クリックします。ポップアップ メニューでオプション 3 を選択します。開いたインターフェイスでオプション 4 を選択します。開いたページの左側にあるイージー バーを使用してオプション 5 を選択します。開いたページの右側にカラー フィルター インターフェイスが表示されます。

Meituan Takeout 加盟店版の配達開始価格を変更する方法 Meituan Takeout 加盟店版の配達開始価格を変更する方法 Mar 27, 2024 pm 07:20 PM

Meituan Takeout Merchant Edition の運用プロセスにおいて、配達開始価格の設定は重要なリンクです。合理的な開始配達価格は、販売者がコストを管理するのに役立つだけでなく、注文量をある程度増やすことができるため、全体的な収益も増加します。ただし、多くの販売者は最低配達価格を変更する方法についてあまり知りません。そこで、次の記事では、この Web サイトの編集者が販売者向けに詳細な開​​始価格設定ガイドをお届けします。さらに詳しく知りたい場合は、次の記事を参照してください。 Meituan Takeout Merchant Center にログインして店舗設定を入力し、店舗管理を選択し、店舗管理ページ上部のナビゲーション切り替えで配送情報を選択し、配達エリアを追加をクリックして操作を完了します。場所を追加すると、対応する送料が自動的に表示されます。ご注文完了後、お手元に届きます

Win7コンピュータで境界線の色を変更する方法 Win7コンピュータで境界線の色を変更する方法 Jul 17, 2023 am 08:53 AM

Win7 システムは最も一般的に使用されているコンピュータ システムの 1 つと言えますが、最近 Win7 システムを使用している友人の中には、フレームの色を変更したいが、Win7 コンピュータのフレームの色を変更する方法がわからないという人がいます。以下のWin7コンピュータのフレームの色を変更する方法。 Win7 コンピュータで境界線の色を変更する方法 1. ポップアップ メニュー バーのデスクトップの空白領域を右クリックし、[個人用設定] を選択します; 2. 個人用設定インターフェイスに入り、テーマの下のウィンドウの色をクリックします; 3. ウィンドウの色が設定されているウィンドウの数がわかります。適用したい色をダブルクリックすると、ウィンドウとタスクバーの色が正常に設定されたことがわかります; 4. 色の下にある濃度オプションをクリックして、ウィンドウの色の濃度を増減します。濃度が濃いほど、

win11でアイコンのサイズを変更する方法 win11でアイコンのサイズを変更する方法 Jul 04, 2023 pm 03:57 PM

win11でアイコンのサイズを変更するにはどうすればいいですか? Win11 は、非常に使いやすいコンピュータ オペレーティング システムのバージョンです。今日、世界中のコンピュータ オペレーティング システムの半分を占めています。多くの友人も、このバージョンの Windows システムには多くの機能があることに気付きました。友人の中には、質問したり、時々私が言ったりしました。デスクトップ上のアイコン表示がよく見えません。アイコンのサイズを変更するにはどうすればよいですか?そこで今日は、編集者が次の記事を使用して次の質問について説明します。興味のある学生は以下を読んでください。 win11 アイコンのサイズを調整する方法: マウスを押したまま「ctrl」キーを使用してサイズを調整します 1. デスクトップのアイコンが大きすぎます。 2. win11 アイコンのサイズを調整するには? まず、キーボードの左下隅にある「ctrl」を押したままにします。 3. マウスホイール

jQueryを使用して要素の可視性を制御する jQueryを使用して要素の可視性を制御する Feb 20, 2024 am 10:25 AM

タイトル:jQueryを使って要素の表示属性を変更する Web開発では、ユーザーの操作やページの状態に応じて要素の表示・非表示を動的に変更する必要が生じることがよくあります。 jQueryを使って要素の表示属性を操作するのは一般的で便利な方法です。この記事では、jQueryを使って要素の表示属性を変更する方法と具体的なコード例を紹介します。まず、jQuery ライブラリ ファイルをインポートする必要があります。 HTML ファイルに次のコードを渡します

win10録画の保存場所を変更する方法 win10録画の保存場所を変更する方法 Jul 22, 2023 pm 08:05 PM

ビデオを録画した後、最初に録画したビデオが見つからない場合は、保存場所を変更してください。 Win10で録画した動画の保存先を変更する方法。編集者と一緒に見てみましょう。 1. ローカルビデオフォルダーに入り、「プロパティ」を右クリックします。 「配置」をクリックします。 3. 「移動」ボタンをクリックします。 4. 任意のフォルダーを新しい保存フォルダーとして選択します。 5. [はい] をクリックして、保存したフォルダーを変更します。

win7でデフォルトのcドライブをdドライブに変更する方法 win7でデフォルトのcドライブをdドライブに変更する方法 詳しい紹介 win7でデフォルトのcドライブをdドライブに変更する方法 win7でデフォルトのcドライブをdドライブに変更する方法 詳しい紹介 Jul 12, 2023 pm 07:09 PM

C ドライブはユーザーのデフォルトの C ドライブです。コンピュータをアクティブ化すると、C ドライブがデフォルトの C ドライブであることがユーザーに表示されます。ユーザーの重要なシステム ファイルはこのドライブにあるため、ユーザーが誤って C ドライブを削除すると不便になります。重要なファイルを保存したり、いくつかのアプリを C ドライブにインストールしたりする場合、Win7 でデフォルトの C ドライブを D ドライブに変更する方法は次のとおりです。次に、Win7 でデフォルトの C ドライブを D ドライブに変更する方法を説明します。 。 win7 でデフォルトの c ドライブを d ドライブに変更する方法 1. まずコンピューターで d ドライブを開きます; 2. d ドライブにファイルの保存パスを作成します; 3. 「win + r」キーの組み合わせで操作バーを開きます「regedit」と入力します。「レジストリ エディタを開きます。4. 上記のコンピュータ パスをコピーします。」\HKEY_LO

CSS3 の新機能の概要: CSS3 を使用して Web ページのレイアウトを変更する方法 CSS3 の新機能の概要: CSS3 を使用して Web ページのレイアウトを変更する方法 Sep 10, 2023 pm 02:39 PM

CSS3 の新機能の概要: CSS3 を使用して Web ページのレイアウトを変更する方法 近年、インターネット技術の発展に伴い、独自の Web ページを作成する人が増えています。 Web デザインの重要な部分として、レイアウト デザインは Web ページの全体的な効果とユーザー エクスペリエンスに直接影響します。カスケード スタイル シートの最新バージョンである CSS3 には、Web ページのレイアウトをより適切に変更するのに役立つ多くの新機能が導入されています。この記事では、これらの新機能を 1 つずつ紹介し、CSS3 を使用して Web ページのレイアウトを変更する方法を事例を通して説明します。 1.ボックスモデルとクロス

See all articles