首頁  >  文章  >  web前端  >  如何更改 CSS 中底線的顏色?

如何更改 CSS 中底線的顏色?

Patricia Arquette
Patricia Arquette原創
2024-11-04 16:28:02464瀏覽

How Can I Change the Color of an Underline in CSS?

CSS 文字裝飾下劃線顏色

在 Web 開發中,在某些情況下您可能希望對文字下劃線進行樣式化。本文解決了更改文字​​行下方下劃線顏色的挑戰,從而創建獨特的視覺效果。

解決方案1:text-decoration-color(現代瀏覽器)

對於支援text-decoration-color 屬性的現代瀏覽器,只需套用以下CSS規則:

text-decoration-color: green;

此方法允許直接指定底線顏色。

解決方案2:border-bottom(舊版瀏覽器)

如果舊版瀏覽器不支援text-decoration-color 屬性,另一個方法是使用border -bottom 屬性:

a:link {
  color: red;
  text-decoration: none;
  border-bottom: 1px solid blue;
}
a:hover {
 border-bottom-color: green;
}

此方法在文字底部加入彩色邊框,有效模仿下劃線的外觀。

以上是如何更改 CSS 中底線的顏色?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

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