ホームページ  >  記事  >  ウェブフロントエンド  >  HTML はハイパーリンクのフォントの色とクリック後のフォントの色を設定します

HTML はハイパーリンクのフォントの色とクリック後のフォントの色を設定します

巴扎黑
巴扎黑オリジナル
2017-06-03 13:53:578039ブラウズ

CSS は、「疑似クラス」と呼ばれる、いくつかの特殊効果用の特定のツールを準備します。よく使用するものがいくつかあります。以下では、リンク スタイルを定義するためによく使用される 4 つの疑似クラスを詳しく紹介します。 リンク スタイルの定義
CSS は、「疑似クラス」と呼ばれる、いくつかの特殊効果のための特定のツールを提供します。よく使うものがいくつかありますので、リンクスタイルの定義によく使われる 4 つの疑似クラスを詳しく紹介します。
:link
:visited
:hover
:active
であるためです。リンクスタイルを定義するため、重要なのはハイパーリンク内のアンカータグです。アンカータグと疑似クラスリンクの記述方法は、リンクスタイルを定義する基本的な方法です。
a:リンク、定義は通常です。
a:visited、訪問したリンクのスタイルを定義します。
a:hover、マウスがリンク上に移動したときのスタイルを定義します。マウスがリンクをクリックします。
例:
コードは次のとおりです:

a:link { 
color:#FF0000; 
text-decoration:underline; 
} 
a:visited { 
color:#00FF00; 
text-decoration:none; 
} 
a:hover { 
color:#000000; 
text-decoration:none; 
} 
a:active { 
color:#FFFFFF; 
text-decoration:none; 
}

上記の例で定義されているリンクの色は赤、訪問先のリンクは緑、マウスが上にあるときのリンクは黒、クリックされたときの色は白です。

通常のリンクが訪問先リンクと同じスタイルで、マウスがホバーしてクリックされているときのスタイルも同じである場合、それらをマージして定義することもできます:

コードは次のとおりです:

a:link, 
a:visited { 
color:#FF0000; 
text-decoration:underline; 
} 
a:hover, 
a:active { 
color:#000000; 
text-decoration:none; 
}

The orderリンク定義

ルールはありません リンク定義は書いてありますが、この4つの項目の書き方の順番を少し間違えるとリンクの効果がなくなる可能性がありますので必ず確認してください。リンク スタイルを定義するたびに、link--visited- -hover-active という定義順序が適用されます。これは、私たちがよく LoVe HAte 原則と呼ぶものです (大文字は最初の文字です)。
ローカル リンク スタイルを定義する
CSS で a:link{} のような定義を記述すると、ページ全体のリンク スタイルが変更されますが、一部のローカル リンクは特殊化する必要があります。リンク スタイル定義の前に、指定した ID またはクラスを追加するだけです。
例:

コードは以下の通り:

#sidebar a:link, 
#sidebar a:visited { 
color:#FF0000; 
text-decoration:none; 
} 
#sidebar a:hover, 
#sidebar a:active { 
color:#000000; 
text-decoration:underline; 
}

メソッドの呼び出し:

8bd8f5f601bef3de2be1c11f4668a4f03af164a93a5833bb6f81b7178fd4db8bLink Go to Script Home3499910bf9dac5ae3c52d5ede738348594b3e26ee717c64999d7867364b1b4a3
クラスの定義方法は、#sidebar を .sidebar に変更するだけです。これは、より直接的な方法です。ただし、呼び出しはさらに面倒で、定義されたコードをそれぞれの特定のリンクに追加する必要があります。
例:
コードは次のとおりです:

 a.redlink a:link, 
a.redlink a:visited { 
color:#FF0000; 
text-decoration:none; 
} 
a.redlink a:hover, 
a.redlink a:active { 
color:#000000; 
text-decoration:underline; 
background:#FFFFFF; 
}

メソッドの呼び出し:

e388a4556c0f65e1904146cc1a846bee467c074396382ef3b53fa5429065c11eスクリプト ホーム 1 へのリンク3499910bf9dac5ae3c52d5ede738348594b3e26ee717c64999d7867364b1b4a3 リンクの定義には主に色、テキスト装飾、背景の 3 つの属性があります

以上がHTML はハイパーリンクのフォントの色とクリック後のフォントの色を設定しますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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