2017-02-06 7 views
1

Ich verwende WordPress, um eine Website zu erstellen (mit dem Thema 2017). Ich habe einen Link durch den folgenden HTML-Zugabe:a: Hover funktioniert nicht richtig

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

dann hatte ich von Wordpress, um loszuwerden, unterstreichen, indem Sie diesen 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; 
} 

mein nächstes Ziel ist es, die Hypertext die Farbe wechseln zu haben, wenn jemand schwebt darüber und bis jetzt habe ich dies in der CSS getan:

Das Problem ist; die Hintergrundfarbe war ursprünglich #def, und es funktionierte, wenn man schwebte, aber die Textfarbe blieb blau #0000ff. Ich habe versucht, !important hinzufügen und ich habe sogar versucht, es rot #FF0000.

Ich ging sogar zurück in den html, um die Farbe des Textes zu löschen, um zu sehen, ob es dem blauen HTML statt des roten CSS Priorität gab, aber sogar der einfache schwarze Text würde nicht zu Rot ändern, wenn ich schweben darüber.

Bin ich etwas fehlt?

+0

dies scheint ein Problem mit CSS Spezifität zu sein, Ihr Inline-Stil der Spanne hat eine höhere Priorität über die Pseudo-Element: schweben – semuzaboi

+0

@luciferous Das ist keine Spezifität. –

Antwort

1

Sie müssen die Span-Farbe ändern, weil Sie einen Inline-Stil haben, der die Span-Farbe erzwingt oder diese entfernt und nur CSS verwendet.

Beispiel:

.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>

0

versuchen diese:

Bitte entfernen Spanne style="color: #0000ff;"

dann können Sie Spanne hinzufügen: schweben

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

Demo here

0

, dass aufgrund dieser Linie ist.

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

Inline-Styling eine höhere Priorität als CSS in einer CSS-Datei erhalten. Versuchen Sie stattdessen

Hinzufügen

html

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

css

span{color:#0000FF}