CSS ve CSS3 Arasındaki Farklar

Meşgul yaratıcı ofiste masa başında çalışan kadın

Modern bir ofiste bilgisayarında çalışan bir kadın web tasarımcısı

Resim Kredisi: maymunbusinessimages/iStock/Getty Images

Orijinal Basamaklı Stil Sayfaları spesifikasyonu ve çok daha yeni CSS3 revizyonu, HTML Web sayfalarını geliştirmek ve biçimlendirmek için kullanılan teknolojilerdir. CSS, başlangıçta, bir Web sayfasının sunum katmanını, aşağıdakilerden daha verimli bir şekilde ele almak için tasarlandı. Çağdaş Web'in karmaşık yapısını asla ele almaya yönelik olmayan HTML ile biçimlendirme. CSS2, CSS1'in evrensel olarak benimsenmiş bir uzantısı olduğu için, sayı içermeyen CSS terimi, CSS2'nin dahil edilmesini ifade eder. Temmuz 2014 itibariyle CSS3 spesifikasyonu hala geliştirme aşamasındadır, bu nedenle Web geliştiricilerinin özellik desteğinin tarayıcılar arasında farklılık gösterdiğini göz önünde bulundurmaları gerekir.

CSS3, CSS ile Geriye Uyumludur

CSS3, CSS'nin tüm özellikleriyle uyumluluğu koruyan bir CSS2 güncellemesidir - CSS3, CSS kodlarından hiçbirini kullanımdan kaldırmaz. CSS3 kodu, Web sayfalarının daha iyi görünmesini ve daha hızlı yüklenmesini sağlamak ve ayrıca bir kullanıcının tarayıcısında sayfalar oluşturmak için geliştirme süresini azaltmak için tasarlanmıştır. CSS3, Web tasarımını sayfa tasarım öğeleri için görüntü dosyalarına daha az bağımlı hale getirir ve daha az görüntü kullanarak dosya aktarım isteklerini ve indirme süresini azaltır. CSS1 görünüm biçimlendirmeye odaklanırken, CSS2 metin ve nesneler için konumlandırma yetenekleri ekledi. IE 9 ve önceki gibi daha eski tarayıcı sürümleri, CSS yedek kodunu korumak için ekstra geliştirme süresi gerektirebilecek CSS3'ün ek özelliklerini yaygın olarak desteklemez.

Günün Videosu

CSS3 Yuvarlatılmış Köşeler ve Gradyanlar Ekler

CSS3'ten önce, Web geliştiricilerinin, yapısal kenarlıklar ve arka plan görüntüsü gradyanları için yuvarlatılmış köşeler gibi şeyler eklemek için görüntü dosyaları tasarlaması gerekiyordu; CSS3, birkaç satır kodla eklenebilecek karşılaştırılabilir özellikler içerir. CSS'de, bir Web geliştiricisinin bir kenarlık veya gradyan tasarlaması, onu görüntü sunucusuna yüklemesi, görüntüyü sayfaya yerleştirmesi ve sınırı doğru şekilde konumlandırmak için CSS'yi kullanması gerekir. CSS3'te, Web geliştiricisi ".roundBorder{border-radius: 10px;}" gibi bir kodla benzer bir şey başarabilir. Arka plan gradyanları biraz daha karmaşıktır ve farklı tarayıcılar için farklı kodlar gerektirir. Örneğin, Chrome ve IE için beyazdan siyaha bir degrade ".gradBG{background: liner-gradient (beyaz, siyah);}" gibi bir kod kullanır.

CSS3, Animasyon Özellikleri ve Metin Efektleri Ekliyor

CSS3, sayfa öğelerinizin görünümünü iyileştirmek için CSS'de bulunmayan birkaç özelliğe sahiptir. CSS3 ile Web geliştiricileri, okumayı kolaylaştırmak veya görsel yetenek eklemek için metne bir metin gölgesi ekleyebilir ve daha uzun sözcüklerdeki satır sonlarını, sözcük sarmalı sütunlara sığdırmak için zorlayabilir. CSS3'ten önce, Web geliştiricilerinin animasyonu JavaScript ve jQuery gibi komut dosyası dillerinde kodlaması gerekiyordu; CSS3, tasarım katmanına birkaç animasyon özelliği ekler. W3C, farklı animasyon teknikleri arasındaki uyumluluk sorunlarını çözmek için hala bir Web animasyonları standardı üzerinde çalışıyor.

CSS3 Metin Sütunlarını Tanımlar

CSS3, bir gazete gibi okumak için metin bölümlerini birden çok sütuna bölme yeteneği ekler. CSS2 spesifikasyonunda, standart metni otomatik olarak bölmek için donatılmadığından, Web geliştiricileri çok sütunlu metin bölümleri oluşturmakta zorlanırlar. Özellikle duyarlı tasarıma sahip sitelerde, içeriği temel alarak yeniden düzenleyen ve yeniden boyutlandıran bir geliştirme tekniği. Cihazın ekran çözünürlüğünü görüntülediğinde, daha büyük monitörleri olan kişiler, ekran boyunca yayılan metin satırlarını okumakta zorlanabilirler. ekran.