Ön uç web sitesi geliştirme, genellikle aşağıdakilerden oluşan üç ayaklı bir tabure olarak temsil edilir:
- Bir sitenin yapısı için HTML
- Görsel stiller için CSS
- Davranışlar için Javascript
Bu taburenin ikinci ayağı olan Basamaklı Stil Sayfaları, bir belgeye ekleyebileceğiniz üç farklı stili destekler.
- Satır içi stiller
- Gömülü stiller
- Dış stiller
Bu CSS stillerinin her biri benzersiz avantajlar ve dezavantajlar sunar.
Satır İçi Stiller
Satır içi stiller, doğrudan HTML belgesindeki etikete yazılan stillerdir. Satır içi stiller yalnızca uygulandıkları belirli etiketi etkiler:
Bu CSS kuralı, bu tek bağlantı için standart altı çizili metin dekorasyonunu devre dışı bırakır. Bununla birlikte, sayfadaki diğer herhangi bir bağlantıyı değiştirmez. Bu, satır içi stillerin sınırlamalarından biridir. Yalnızca belirli bir öğede değiştiklerinden, birleşik bir sayfa tasarımı elde etmek için HTML’nizi bu stillerle doldurmanız gerekir. Bu bir en iyi uygulama değil: Aslında, bu, yazı tipi etiketler ve web sayfalarında yapı ve stilin katkısı. Satır içi stiller ayrıca çok yüksek özgüllük gerektirir. Bu, diğer, satır içi olmayan stillerle üzerine yazmayı zorlaştırır. Örneğin, bir siteyi duyarlı hale getirmek ve ortam sorgularını kullanarak bir öğenin belirli kesme noktalarına nasıl baktığını değiştirmek istiyorsanız, bir öğe üzerindeki satır içi stiller bunu yapmayı zorlaştırır. Satır içi stiller, bir veya iki öğeyi sayfadaki eşlerinden ayıran “kuralın istisnası” yaklaşımında, yalnızca bunları tutumlu bir şekilde kullandığınızda uygundur.
Gömülü Stiller
Gömülü stiller, belgenin başlığında bulunur. Kapanmışlar
Bir belgenin başlığına eklenen stil sayfaları da o sayfaya önemli miktarda biçimlendirme kodu ekler ve bu da sayfanın ileride yönetilmesini zorlaştırabilir. Gömülü stil sayfalarının avantajı, diğer harici dosyaların yüklenmesini gerektirmek yerine sayfanın kendisiyle birlikte hemen yüklenmesidir. Bu teknik, indirme hızı ve performans açısından bir avantaj olabilir.
Harici Stil Sayfaları
Günümüzde çoğu web sitesi harici stil sayfaları kullanmaktadır. Dış stiller, ayrı bir belgede yazılan ve ardından çeşitli web belgelerine eklenen stillerdir. Kullanılarak ana belgeye çağrılırlar.
belgenin başındaki etiketi. Harici stil sayfaları ya HTML ile aynı sunucuda bulunabilir ya da tamamen başka bir sunucudan alınabilir. Bu, çoğu sitenin Google’dan ödünç aldığı yazı tipleri gibi varlıklarda sıklıkla karşılaşılan bir durumdur. Harici stil sayfaları, eklendikleri herhangi bir belgeyi etkiler; bu, her sayfanın aynı stil sayfasını kullandığı 20 sayfalık bir web siteniz varsa (bu genellikle böyle yapılır), bunların her birinde görsel bir değişiklik yapabileceğiniz anlamına gelir. o stil sayfasını düzenleyerek sayfalar. Bu ekonomi, uzun vadeli site yönetimini çok daha kolay hale getirir.
Çoğu profesyonel web tasarımcısı, bir sitenin düzenini ve tasarımını yönetmek için birincil bir CSS dosyası kullanır. Harici stil sayfalarının dezavantajı, bu harici dosyaları getirmek ve yüklemek için sayfalara ihtiyaç duymalarıdır. Her sayfa CSS sayfasındaki her stili kullanmayacağından, pek çok sayfa gerçekte gerekenden çok daha büyük bir CSS sayfası yükleyecektir. Harici CSS dosyaları için bir performans düşüşü olduğu doğru olsa da, kesinlikle en aza indirilebilir. Gerçekçi olarak, CSS dosyaları yalnızca metin dosyalarıdır, bu nedenle başlangıç için büyük değildirler. Sitenizin tamamı tek bir CSS dosyası kullanıyorsa, o belgenin ilk yüklendikten sonra önbelleğe alınmasından da yararlanabilirsiniz; bu, bazı ziyaretler için ilk sayfada küçük bir performans düşüşü olabileceği anlamına gelir, ancak sonraki sayfalar önbelleğe alınmış CSS dosyası, bu nedenle herhangi bir isabet reddedilir.
Biçim mla apa chicago Alıntıınız
Kyrnin, Jennifer. “3 Tür CSS Stilini Anlamak.” ThoughtCo, Mayıs. 14, 2021, thinkco.com/types-of-css-styles-3466921.
Kyrnin, Jennifer. (2021, 14 Mayıs). 3 Tür CSS Stilini Anlamak. Https://www.thoughtco.com/types-of-css-styles-3466921 adresinden erişildi
Kyrnin, Jennifer. “3 Tür CSS Stilini Anlamak.” ThoughtCo. https://www.thoughtco.com/types-of-css-styles-3466921 (erişim tarihi 19 Mayıs 2021).
