Metin dekorasyonu kaldırma
Bağlantı alt çizgisini kaldırmayı ve geri eklemeyi öğrenirsin.
Alt çizgiyi denetle
Tarayıcılar varsayılan olarak a bağlantılarına alt çizgi çizer. Bu alt çizgi, bağlantıyı normal metinden ayıran en belirgin işarettir. text-decoration özelliği ile alt çizgiyi denetleriz.
Alt çizgiyi kaldırmak için text-decoration: none, geri eklemek için text-decoration: underline yazılır. Bu denetim menü çubuklarında ve düğme görünümlü bağlantılarda sıkça kullanılır.
Üzerine gelince geri ekle
Yaygın bir desen: bağlantıda alt çizgiyi kaldır, fareyle üzerine gelince geri ekle. Böylece ziyaretçi bağlantıyı metinden ayırt eder ama sayfa dağınık görünmez.
Bunu şöyle yaparsın: a { text-decoration: none; } alt çizgiyi kaldırır, a:hover { text-decoration: underline; } fareyle üzerine gelince geri ekler. Bu küçük etkileşim menü ve gezinme listelerinde çok işe yarar.
Uygulama Alt çizgiyi kaldır, üzerine gelince geri ekle
İki stil bloğu ekle. Birincisi a tür seçicisi; text-decoration: none tanımlasın. İkincisi a:hover sahte sınıfı; text-decoration: underline tanımlasın.
Örnek çözümü göster
/* bağlantı alt çizgisi denetimi */
a {
text-decoration: none;
}
a:hover {
text-decoration: underline;
}Kendini test et
-
Alt çizgiyi hangi değer kaldırır?
a { text-decoration: ?; }- text-decoration: none
- text-decoration: no-underline
- text-decoration: hidden
- text-decoration: 0
Cevabı göster
text-decoration: none — Doğru. text-decoration: none alt çizgiyi kaldırır.
-
Alt çizgiyi kaldır
a { ____; color: navy; }Cevabı göster
a { text-decoration: none; color: navy; } -
Değeri anlamına eşle
- none
- Alt çizgi yok
- underline
- Alt çizgi
- line-through
- Üstü çizili
- overline
- Üst çizgi