如何使用 CSS3 創建帶有紅色文字的黑色底線？

在不影響文字顏色的情況下更改下劃線顏色

在提供的程式碼片段中，您已使用HTML 標記建立了帶下劃線的文字。雖然文字本身是紅色的，但您試圖將下劃線顏色分離為黑色。讓我們來探索一個 CSS3 解決方案來應對這個挑戰。

引入 text-decoration-color

CSS3 現在引入了 text-decoration-color 屬性，解決了您的困境。透過此屬性，您可以操縱文字裝飾（例如底線）的顏色，而不影響文字本身。

用紅色文字建立黑色底線

來實現您想要的輸出，實現以下CSS 屬性：

將此CSS 應用於HTML元素，如下所示：

因此，您的文字將保持紅色，而下劃線將變為黑色，無需使用額外的包裝即可獲得所需的效果。

以上是如何使用 CSS3 創建帶有紅色文字的黑色底線？的詳細內容。更多資訊請關注PHP中文網其他相關文章！