Metin dekorasyonu ve gölge
text-decoration ve text-shadow ile metne efekt eklersin.
Metin dekorasyonu
Metnin altını, üstünü veya üzerini çizmek için text-decoration özelliği kullanılır. Yaygın değerler: underline (alt çizgi), overline (üst çizgi), line-through (üstü çizili) ve none (çizgi yok).
Bağlantıların varsayılan alt çizgisini kaldırmak için text-decoration: none; yazılır. Renk ve biçim de eklenebilir: text-decoration: underline red wavy; kırmızı dalgalı bir alt çizgi çizer.
Metin gölgesi
Metne gölge eklemek için text-shadow özelliği kullanılır. Değer dört parçadan oluşur: yatay kayma, dikey kayma, bulanıklık yarıçapı ve renk.
Örneğin text-shadow: 2px 2px 4px rgba(0,0,0,0.5); metne sağa ve aşağı 2'şer piksel kaymış, 4 piksel bulanık, yarı saydam siyah bir gölge verir.
Bulanıklık 0 olursa gölge keskin kenarlı olur; büyük değerler daha yumuşak dağılır.
Uygulama Başlığa dekorasyon ve gölge ekle
h1 seçicisi için bir blok aç. İçine şu iki bildirimi ekle: text-decoration: underline; ve text-shadow: 2px 2px 4px rgba(0,0,0,0.5);.
Örnek çözümü göster
h1 {
text-decoration: underline;
text-shadow: 2px 2px 4px rgba(0,0,0,0.5);
}Kendini test et
-
Bağlantının alt çizgisini kaldırmak için hangi değer yazılır?
- text-decoration: none;
- text-decoration: underline;
- text-decoration: overline;
- text-decoration: line-through;
Cevabı göster
text-decoration: none; — Doğru. text-decoration: none; tüm çizgi efektlerini kaldırır.
-
Başlığın altını çiz
h2 { text-decoration: ____; }Cevabı göster
h2 { text-decoration: underline; } -
text-shadow parçasını anlamıyla eşleştir
- İlk sayı
- Yatay kayma
- İkinci sayı
- Dikey kayma
- Üçüncü sayı
- Bulanıklık yarıçapı
- Son değer
- Gölge rengi
-
Hangi text-shadow değeri en yumuşak gölgeyi verir?
- text-shadow: 2px 2px 0px gray;
- text-shadow: 2px 2px 1px gray;
- text-shadow: 2px 2px 2px gray;
- text-shadow: 2px 2px 8px gray;
Cevabı göster
text-shadow: 2px 2px 8px gray; — Doğru. Bulanıklık yarıçapı 8 piksel en geniş dağılımı verir; gölge en yumuşak olur.