Warum ist mein Link immer noch unterstrichen, obwohl ich „text-decoration: none;' verwende?

So entfernen Sie die blaue Unterstreichung von einem Link

Problem:

Sie haben einen Link, der weiß angezeigt wird, aber Frustrierenderweise bleibt es mit einer blauen Unterstreichung bestehen. Trotz Anwendung von text-decoration: none; weigert sich die Unterstreichung selbst mit der !important-Regel, sich zu bewegen.

.boxhead .otherPage {
  color: #FFFFFF;
  text-decoration: none;
}

Lösung:

Bei näherer Betrachtung Sie Habe herausgefunden, dass die text-decoration: none; Die Regel wird falsch angewendet. Sie wenden es auf ein Span-Element (.boxhead) an, es sollte jedoch direkt auf das Ankerelement (.boxhead a) angewendet werden.

.boxhead a {
    color: #FFFFFF;
    text-decoration: none;
}

Überarbeiteter Code:

<div class="boxhead">
  <h2>
    <span class="thisPage">Current Page</span>
    <a href="myLink"><span class="otherPage">Different Page</span></a>
  </h2>
</div>

.boxhead a {
    color: #FFFFFF;
    text-decoration: none;
}

Durch die Anwendung dieser Korrektur wird die blaue Unterstreichung erfolgreich aus Ihrem Link entfernt, sodass er ohne unerwünschte Elemente in Weiß angezeigt wird Ablenkungen.

Das obige ist der detaillierte Inhalt vonWarum ist mein Link immer noch unterstrichen, obwohl ich „text-decoration: none;' verwende?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!