Metin-dekorasyon-rengi - CSS Hileleri

Anonim

text-decoration-colorİle mülkiyet metin üzerinde aracılığıyla hat-altı çizili, overline veya rengini ayarlar text-decorationözelliği uyguladı. Bağlantılardaki alt çizgi rengini de ayarlayabilir.

a ( text-decoration-color: #E18728; )

Değerler

text-decoration-colorinheritadlandırılmış renkler, HEX renkler, RGBa ve HSLa dahil herhangi bir CSS renk değerini kabul edebilir veya kabul edebilir .

Kısa gösterim

Bir steno özelliğine renk ekleyebileceğiniz text-decoration-styleve destekleyen tarayıcılarda :text-decoration-colortext-decoration

.underlined ( text-decoration: underline dotted red; )

Şu anda yalnızca Firefox bunu öneksiz olarak desteklemektedir. Safari bunu -webkitönek ile destekler . Chrome ayrıca -webkitönek ve Chrome işaretlerinde etkinleştirilen deneysel web platformu özelliklerine ihtiyaç duyar .

Demo

text-decoration-colorBu demoda Firefox ve Safari'nin güncel sürümlerinde çalışır. Ayrıca, "deneysel Web Platformu özellikleri" bayrağı etkinleştirilmiş olarak Chrome'da da çalışacaktır.

CodePen'de CSS-Tricks (@ css-tricks) tarafından hazırlanan Kalem metin dekorasyon rengine bakın.

İlişkili

  • text-decoration
  • text-decoration-line
  • text-decoration-style
  • text-decoration-skip

Daha fazla bilgi

  • text-decoration-color CSS Metin Süsleme Modülü Seviye 3 CR'de
  • text-decoration-color MDN'de

Tarayıcı Desteği

Krom Safari Firefox Opera IE Android iOS
31 † 7.1 * 6.0 ‡ Yok Yok Yok 8 *

† "deneysel Web Platformu özellikleri" chrome: // flags'de açıkken. Chrome 31 gerekli -webkit- öneki. Chrome 50'yi test ettik ve yalnızca öneksiz çalıştı.
‡ -moz ön ekli 6+, 36 itibariyle öneksiz.