Wie formatiere ich Links, ohne bestimmte darin enthaltene Elemente zu unterstreichen?

Links gestalten, ohne bestimmte Elemente hervorzuheben

Beim Gestalten von Links mit CSS kann es vorkommen, dass man die Unterstreichung von einem bestimmten Element innerhalb des Links nicht entfernen kann . Dies kann frustrierend sein, wenn Sie beispielsweise nur einen Teil des Links hervorheben möchten.

Erklärung des Problems

Im bereitgestellten Code-Snippet:

a {
  text-decoration: underline;
}

a #myspan {
  color: black;
  text-decoration: none;
}

Die Ziel ist es, alle Links außer dem Element mit der ID #myspan unterstrichen zu machen. Trotz der Einstellung text-decoration: none; auf einem #myspan bleibt es unterstrichen. Der Grund dafür ist, dass CSS-Vorrangregeln dem übergeordneten Selektor (a) eine höhere Priorität einräumen als dem spezifischeren Selektor (a #myspan). Daher überschreibt die Unterstreichung von a die Textdekoration: none; Regel für #myspan.

Lösung

Um dieses Problem zu beheben, können wir die Anzeigeeigenschaft von #myspan in inline-block ändern:

a #myspan {
  color: black;
  display: inline-block;
}

Indem wir #myspan erstellen Wenn es sich um ein Inline-Block-Element handelt, entfernen wir seine Beziehung zum a-Element hinsichtlich der Textdekoration. Daher wird die Unterstreichung nicht auf #myspan angewendet.

Das obige ist der detaillierte Inhalt vonWie formatiere ich Links, ohne bestimmte darin enthaltene Elemente zu unterstreichen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!