CSS ホバー コードにリンクに下線が表示されないのはなぜですか?

CSS の 'hover' を理解する

CSS を使用する場合、'hover' はマウス操作時に要素のスタイルを変更するための重要な概念です。ただし、望ましい結果を達成するには、正しい実装が必要です。

「ホバー」の謎

最近、次のコードがホバー時にリンクに下線を引くことができないという疑問が生じました:

<a class="hover">click</a>

a .hover:hover {
    text-decoration: underline;
}

解決策を明らかにする

問題を解決するには、次のことを覚えておく必要があります。 「hover」は擬似要素です。正しい構文は次のとおりです:

a:hover {
    text-decoration: underline;
}

クラス名を使用する場合は、次のようになります:

a.hover:hover {
    text-decoration: underline;
}

「ホバー」クラス名

クラスの使用中「hover」のような -name は冗長に見えるかもしれませんが、ホバー時に複数のプロパティを切り替えたい場合に適用できます。 「.hover」用の別の CSS ルール。ただし、ホバー時にリンクに下線を引くことだけが目的の場合は、引き続き a:hover セレクターが優先されます。

以上がCSS ホバー コードにリンクに下線が表示されないのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。