儘管使用了'text-decoration: none;”，為什麼我的連結仍然帶有下劃線？-css教學-PHP中文網

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

Susan Sarandon

發布： 2024-12-19 19:25:11

原創

909 人瀏覽過

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中文網其他相關文章！