首頁 >web前端 >css教學 >儘管使用了'text-decoration: none;”,為什麼我的連結仍然帶有下劃線?

儘管使用了'text-decoration: none;”,為什麼我的連結仍然帶有下劃線?

Susan Sarandon
Susan Sarandon原創
2024-12-19 19:25:11913瀏覽

Why Is My Link Still Underlined Despite Using `text-decoration: none;`?

如何從連結中刪除藍色底線

問題:

您有一個連結顯示為白色,但令令人沮喪的是仍然帶有藍色底線。儘管應用了 text-decoration: none;,即使使用 !important 規則,底線也拒絕移動。

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

解決方案:

經過仔細檢查,您發現文字裝飾:無;規則應用不正確。您將其應用於跨度元素 (.boxhead),但它應該直接應用於錨元素 (.boxhead a)。

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

修訂後的程式碼:

<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;
}

透過套用此修正,您將成功從連結中刪除藍色底線,使其以白色顯示,而無需任何不必要的干擾。

以上是儘管使用了'text-decoration: none;”,為什麼我的連結仍然帶有下劃線?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn