Varsayılan olarak, metin içeriği HTML'ye bağlı veya "çapa" öğesinin kullanılması, bir alt çizgi ile stillendirilir. Çoğu zaman, web tasarımcıları alt çizgiyi kaldırarak bu varsayılan stili kaldırmayı seçer.
Alt Çizilmeye Karşı Nedenler
Birçok tasarımcı, özellikle çok sayıda bağlantı içeren yoğun içerik bloklarında, altı çizili metnin görünümüne önem vermez. Tüm bu altı çizili kelimeler, bir belgenin okuma akışını gerçekten bozabilir. Birçoğu, bu alt çizgilerin, alt çizginin doğal harf biçimlerini değiştirme biçimi nedeniyle kelimeleri ayırt etmeyi ve hızlı okumayı zorlaştırdığını iddia etti.
Bununla birlikte, bu alt çizgileri metin bağlantılarında tutmanın meşru yararları vardır. Örneğin, büyük metin bloklarına göz attığınızda, uygun renk kontrastıyla birleştirilmiş altı çizili bağlantılar, okuyucuların bir sayfayı hemen taramasını ve bağlantıların nerede olduğunu görmesini kolaylaştırır.
Bağlantıları metinden kaldırmaya karar verirseniz (kısa bir süre içinde ele alacağımız basit bir işlem), bağlantının ne olduğunu düz metinden ayırt etmek için o metne stil vermenin yollarını bulduğunuzdan emin olun. Bu en sık ile yapılır
renk kontrastı, ancak renk tek başına renk körlüğü gibi görme bozukluğu olan ziyaretçiler için sorun oluşturabilir. Renk körlüğünün özel biçimine bağlı olarak, kontrast tamamen kaybolabilir ve bağlantılı ve bağlantısız metin arasındaki farkı görmelerini engelleyebilir. Bu nedenle altı çizili metin, bağlantıları göstermenin en iyi yolu olarak kabul edilir.Öyleyse, hala yapmak istiyorsanız, bir alt çizgiyi nasıl kapatırsınız? Bu, ilgilendiğimiz görsel bir özellik olduğundan, web sitemizin görsel olan her şeyi ele alan kısmına - CSS'ye döneceğiz.
Bağlantılardaki Alt Çizgileri Kapatmak için Basamaklı Stil Sayfalarını Kullanın
Çoğu durumda, yalnızca bir metin bağlantısında alt çizgiyi kapatmak istemezsiniz. Bunun yerine, tasarım stiliniz muhtemelen tüm bağlantılardan alt çizgileri kaldırmanızı gerektiriyor. Bunu, stilinize stiller ekleyerek yapardınız. harici stil sayfası.
bir {
metin-dekorasyon: yok;
}
Bu kadar! Bu basit bir çizgi CSS tüm bağlantılarda alt çizgiyi (aslında "metin-dekorasyon" için CSS özelliğini kullanır) kapatırdı.
Ayrıca bu tarzla daha spesifik olabilirsiniz. Örneğin, yalnızca "nav" öğesinin içindeki alt çizgiyi veya bağlantıları kapatmak istiyorsanız şunu yazabilirsiniz:
gezin bir {
metin-dekorasyon: yok;
}
Şimdi, sayfadaki metin bağlantıları varsayılan alt çizgiyi alacak, ancak gezinmedekiler onu kaldıracaktı.
Birçok web tasarımcısının yapmayı seçtiği bir şey, birisi metnin üzerine geldiğinde bağlantıyı tekrar "açmaktır". Bu, :hover kullanılarak yapılır CSS sözde sınıfı, böyle:
bir {
metin-dekorasyon: yok;
}
a: üzerine gelin {
metin-dekorasyon: altı çizili;
}
Satır İçi CSS'yi Kullanma
Harici bir stil sayfasında değişiklik yapmaya alternatif olarak, stilleri doğrudan HTML.
Bu yöntemle ilgili sorun, stil bilgilerini HTML yapınızın içine yerleştirmesidir, bu en iyi uygulama değildir. Stil (CSS) ve yapı (HTML) ayrı tutulmalıdır.
Bir sitenin tüm metin bağlantılarının alt çizginin kaldırılmasını istiyorsanız, bu stil bilgisini tek tek her bağlantı, sitenize makul miktarda fazladan işaretleme eklendiği anlamına gelir. kod. Bu sayfa şişkinliği, bir sitenin yükleme süresini yavaşlatabilir ve genel sayfa yönetimini çok daha zor hale getirebilir. Bu nedenlerden dolayı, tüm sayfa stil ihtiyaçları için her zaman harici bir stil sayfasına başvurmak tercih edilir.
Kapanışta
Bir web sayfasının metin bağlantılarından alt çizgiyi kaldırmak ne kadar kolaysa, bunu yapmanın sonuçlarına da dikkat etmelisiniz. Bir sayfanın görünümünü gerçekten temizleyebilmesine rağmen, bunu genel kullanılabilirlik pahasına yapabilir. Bir dahaki sefere bir sayfanın "metin-dekorasyon" özelliklerini değiştirmeyi düşündüğünüzde bunu dikkate alın.