HTML'de Yazının Üstünü Çizmek (Ortasından Çizgi Çekmek) ve HTML'de Yazının Altını Çizmek yazılarımda CSS ile yazıların altına ya da ortasına nasıl çizgi ekleyebileceğimizi paylaşmıştım. Herhangi bir ek stil geliştirmediğimiz durumda text-decoration özelliği, yazı rengi ile aynı renkte olur.
<p>Bütün yazılar içinde <span style="text-decoration:underline;color:red">bu kısım</span> daha dikkat çekicidir.<p>
Peki siyah bir yazının altını ya da üstünü kırmızı gibi farklı bir renk ile çizmek için ne yapabiliriz? CSS özellikleri arasında text-decoration olarak kullandığımız çizginin (yazının altında da olabilir, ortasıda da, üzerinde de) rengini değiştirebildiğimiz text-decoration-color özelliği bulunmaktadır. Bu özelliği yazı ile farklı bir renkte ayarladığımızda:
<p>Tüm satır içinde <span style="text-decoration:underline;text-decoration-color: red;">bu kısım</span> doğru olmadığı için üzeri çizilebilir.<p>
Benzer uygulamalar farklı text-decoration çizgi konumları ile ve renklerle de çoğaltılabilirler.