a：ホバーが正しく動作しない

Question

私はウェブサイトを作成するためにwordpressを使用しています（2017テーマを使用しています）。

.entry-content a, .entry-summary a, .taxonomy-description a, .logged-in-as a, .comment-content a, .pingback .comment-body > a, .textwidget a, .entry-footer a:hover, .site-info a:hover { 
    box-shadow: 0px 0px 0px 0px !important; 
} 

私の次の目標は、時にハイパーテキストの変更の色を持つことです。

その後、

<a href="www." target="_blank"><span style="color: #0000ff;">text</span></a> 

私はこのCSSを追加することで、下線のWordpressを取り除くために持っていた：私は、次のHTMLを追加することで、リンクを追加しました誰かがそれに乗って、これまでCSSでこれを行っています。

a:hover { 
    color: black; 
    background-color: transparent; 
} 

問題は次のとおりです。背景色はもともと#defであり、ホバリングしたときに機能しましたが、テキストの色は青のままでした。#0000ff。私は!importantを追加しようとしましたが、私はそれを赤くしてみました。#FF0000。

テキストの色を削除して、赤いCSSの代わりに青色のhtmlを優先しているかどうかを確認しましたが、ホバーしたときには黒いテキストも赤色に変わりませんその上。

何か不足していますか？

Answer 1

スパンカラーを変更する必要があります。インラインスタイルでスパンカラーを強制的に適用するか、削除してCSSのみを使用するからです。

例：

.entry-content a, .entry-summary a, .taxonomy-description a, .logged-in-as a, .comment-content a, .pingback .comment-body > a, .textwidget a, .entry-footer a:hover, .site-info a:hover { 
 
    box-shadow: 0px 0px 0px 0px !important; 
 
} 
 

 
a:hover, a:hover span { 
 
    color: black !important; 
 
    background-color: transparent; 
 
}

<a href="www." target="_blank"><span style="color: #0000ff;">text</span></a>

Answer 2

、このいずれかを試してみてください。

、あなたはスパンを追加することができますスパンstyle="color: #0000ff;"

を削除してください：

を合わせますなぜならこのラインのです

span:hover { 
    color: black; 
    background-color: transparent; 
} 

Demo here

Answer 3

。

<a href="www." target="_blank"><span style="color: #0000ff;">text</span></a> 

インラインスタイリングは、CSSファイル内でCSSよりも優先順位が高くなります。これはCSSの特異性に問題があると思われる。この代わりに

HTML

<a href="www." target="_blank"><span>text</span></a> 

CSS

span{color:#0000FF}