自訂下劃線顏色
在HTML 編碼中,您可能會遇到這樣的情況:想要用特定顏色為文字添加下劃線,但保留文字本身有不同的顏色。當您使用單一元素來設定文字和下劃線的樣式並導致顏色統一時,就會出現問題。
要解決此問題,您可以利用最新的 CSS3 屬性:text-decoration-color。此屬性可讓您獨立控制下劃線的顏色,使您能夠在同一元素中建立一種顏色的文字和另一種顏色的下劃線。
以下是CSS 程式碼範例:
p { text-decoration: underline; -webkit-text-decoration-color: red; /* for Safari browsers */ text-decoration-color: red; }
以及一個顯示結果的HTML 範例:
<p>Black text with red underline in one element - no wrapper elements here!</p>
透過實作此CSS 屬性,您可以分割文字和屬性底線的樣式,實現您想要的顏色自訂,而不需要額外的包裝器元素。
以上是如何為 HTML 中的文字建立彩色底線?的詳細內容。更多資訊請關注PHP中文網其他相關文章!