CSS Stiliniz nedir? - mankenler

CSS ile çalışma konusunda en karmaşık hususlardan biri (Basamaklı Stil Sayfaları), birçok yönden stiller yazabilmenizdir. Yazı yazısına benzer şekilde, yalnızca dilbilgisi ve yazım kurallarının temel kurallarını anladığınızdan dolayı, özlü nesir yazarlığına sahip olduğunuz anlamına gelmez.

Deneyimli CSS tasarımcıları, düzenlenmesi ve güncellenmesi kolay, kısa, açık CSS hazırlamak için önemli zaman harcıyorlar. Fakat CSS için yeni olanlar gerekenden daha fazla stil yazmaya ve gereksiz stiller yaratmaya eğilimli.

Gereksiz kodların bir web tarayıcısına indirilmesi yalnızca daha uzun sürmesi değil, daha sonra düzenlemek veya düzeltmek daha zordur. Ve kodunuz ne kadar fazla gerekiyorsa, stil uyuşmazlıklarına girme ihtimaliniz de o kadar yüksek olur.

Temiz ve verimli stiller yazmak için beş ipucu:

• Hiç biri yeterli olmadığında asla iki stil oluşturmayın. Örneğin, etiket selektörünü kullanarak başlıklarınızın yazı tipi ailesini değiştiren tüm

  etiketleri için bir stil oluşturabilir ve daha sonra başlıkları değiştirmek için başlığınıza uygulayabileceğiniz bir sınıf seçici kullanarak ikinci bir stil oluşturabilirsiniz. renk.

  Ancak hem rengin hem de yazı tipi ailesinin aynı stilde tanımlanması daha verimli olacaktır. Stilin biçimlendirmesini değiştirmek isterseniz daima geri dönüp bir stil düzenleyerek başka bir kuralı ekleyebilirsiniz.

• Onaltılık renk kodlarını kısaltın. CSS'deki renkleri, onaltılık renk kodunun tamamını da dahil ederek tanımlayabilirsiniz. Bununla birlikte, tekrar eden renk kodlarını kullandığınızda yalnızca ilk üç karakteri eklemeniz gerekir. Örneğin #ffffff, #fff ile aynı; Her ikisi de rengi beyaza üretecek.

• Harici stil sayfaları kullanın. Stilleri, her bir web sayfasının üstündeki bir iç stil sayfasında tanımlayabilir veya stilinizi; ile harici bir dosyaya kaydedebilirsiniz. css uzantısı ve bu stil sayfasını tüm web sayfalarınıza ekleyin. Harici stil sayfaları, sitenizdeki herhangi bir veya tüm sayfada aynı stili kullanmanıza olanak tanıdığından doğası gereği daha verimli olur.

  Örneğin, tüm ana başlıkları koyu, mavi ve büyük kılan bir stil tanımlarsanız, bu stili harici bir stil sayfasında kaydetmek, her başlık için aynı stili kullanmanıza olanak tanır. Sonra, daha sonra başlıklarınızı yeşil renge dönüştürmek istediğinize karar verirseniz, stili bir dış stil sayfasında değiştirebilir ve tüm başlıkları aynı anda değiştirebilirsiniz.

  Stilleri dahili bir stil sayfasına kaydettiyseniz, her dosyadaki başlık stilini düzenlemeniz gerekir.

• Stilleriniz için bir adlandırma kuralı geliştirin. Sınıf veya kimliğe dayalı seçicilerle oluşturulan stilleri istediğiniz gibi adlandırabilmenize rağmen, biçimlendirme dışında anlam taşıyan stiller seçmek en iyisidir.Örneğin, adlı bir stil oluşturursanız. redHeadlines ve daha sonra karar herkese istediğiniz. redHeadlines'in mavi olmasını istiyorsanız, ya mavi bir başlık stiliyle sonuçlanacaksınız. redHeadlines veya tarzı yeniden adlandırmak zorunda kalacak.

  Ve stilin adını değiştirmek, geriye dönüp, mavi dönmek istediğiniz kırmızı bir başlığa sahip olduğunuz her yerde bu stili tekrar uygulamanızı, hangi tür stillerin küresel güncellemeleri yapmak için güçsüzleştiğini içerir. Bu sorundan kaçınmak için, öğelerin konumuna veya önemine işaret eden stil adları oluşturun. mainHafıza çizgileri veya. sidebarHeadlines.

• * Kodunuzu test edin ve doğrulayın. Deneyimli CSS tasarımcıları bile hatalar yapar; bu yüzden Dreamweaver, web sayfalarındaki kodu test etmek ve doğrulamak için pek çok mükemmel araç içerir. Genel hatalarınız için CSS'nizi test ettiğinizden emin olun.

  Aşağıda, CSS kodunuzdaki hataları kontrol etmek için kullanabileceğiniz iki çevrimiçi test servisi verilmektedir. Internet'teki herhangi bir web sayfasının URL'sini bu sitelerin herhangi birindeki adres alanına girin ve kodunuzdaki hataları gösteren bir rapor almak için Gönder düğmesine tıklayın:

  • W3C CSS Doğrulama Hizmeti

  • XHTML-CSS : Geçerli Olun veya Die Learning (Die Öğrenme)