The text-decoration-colorharta menetapkan warna garis bawah, overline, atau barisan melalui teks dengan text-decorationharta digunakan. Ia juga boleh menetapkan warna garis bawah pada pautan.
a ( text-decoration-color: #E18728; )Nilai
text-decoration-colorboleh inheritatau menerima sebarang nilai warna CSS, termasuk warna bernama, warna HEX, RGBa, dan HSLa.
Shorthand
Dalam penyemak imbas yang menyokong text-decoration-styledan text-decoration-coloranda boleh menambahkan warna pada text-decorationharta benda pendek:
.underlined ( text-decoration: underline dotted red; )Pada masa ini hanya Firefox yang menyokong ini tidak dapat diperbaiki. Safari menyokongnya dengan -webkitawalan. Chrome juga memerlukan -webkitawalan dan ciri platform web eksperimental yang diaktifkan dalam bendera Chrome.
Demo
Yang text-decoration-colordalam demo ini berfungsi dalam versi semasa Firefox dan Safari. Ini juga akan berfungsi di Chrome dengan bendera "ciri Platform Web eksperimental" diaktifkan.
Lihat teks pen-hiasan-warna oleh CSS-Tricks (@ css-tricks) di CodePen.
Berkaitan
text-decorationtext-decoration-linetext-decoration-styletext-decoration-skip
Maklumat lanjut
text-decoration-colordalam Modul Hiasan Teks CSS Tahap 3 CRtext-decoration-colordi MDN
Sokongan Penyemak Imbas
| Chrome | Safari | Firefox | Opera | IE | Android | iOS |
|---|---|---|---|---|---|---|
| 31 † | 7.1 * | 6.0 ‡ | Tiada | Tiada | Tiada | 8 * |
† dengan "ciri Platform Web eksperimental" dihidupkan dalam chrome: // flags. Chrome 31 memerlukan awalan -webkit-. Kami menguji Chrome 50 dan ia tidak berfungsi dengan betul.
‡ 6+ dengan awalan -moz, tidak diperbaiki pada 36.