HTML5 & CSS3 – Ders 2
HTML5, yeni CSS3 animasyonlarının yanı sıra, metinlerle çalışmada yeni özellikler de (metni döndürme, metnin konumu, metni resmin etrafına sarmalama) sunmaktadır. Gezinti menüsü kolaylaştırır ve ayrıca web sayfaları formlarında kullanılabilecek farklı öznitelikler ve girdi türleri sunar.
HTML formları site ziyaretçisinden bilgi toplamak istediğinizde gereklidir. Örneğin, kullanıcı kaydı süresince isim, e-posta adresi, kredi kartı vs. gibi bilgiler toplamak için kullanabilirsiniz. Metin alanı, açılır menü, onay düğmesi, onay kutusu vs. gibi mevcut birçok form elementi vardır. HTML5 renk, tarih, saat, e-posta, ay, hafta, sayı, gibi yeni girdi türleri sunmaktadır.
SVG (Ölçeklendirilebilir Vektör Grafikleri) web sayfaları için grafikleri tanımlamada kullanılır. Büyütüldüğünde veya yeniden boyutlandırıldığında kalitesinde değişme olmaması SVG grafiklerinin büyük avantajıdır. Başka bir deyişle farklı boyutlardaki ekran üzerinde çalışıldığında SVG kullanımı idealdir. Bu da ölçeklenebilir vektör grafiklerini mobil cihazlar için uygun hale getirmektedir. SVG görüntüleri ve hareketleri genellikle XML dosyalarında tanımlanır. Ancak, SVG grafiklerini doğrudan HTML5 etiketini kullanarak da dokümanınıza ekleyebilirsiniz. SVG filtreleri, SVG grafiklerine özel efekt eklemek için kullanılır. Her bir SVG öğesinde birden çok filtre kullanabilirsiniz.
CSS3 dönüşümler; elementlere pozisyon vermenizi (translate), elementleri döndürmenizi (rotate), büyütmenizi (scale) ve bükebilmenizi (skew) sağlar. Dönüşüm, bir HTML objesinin; şekil, boyut ve konumunu değiştirmesini sağlayan bir efekttir. CSS3, pozisyon (translate), döndürme (rotate), bükme (skew), X ekseninde çevirme (rotateX), Y ekseninde çevirme (rotateY) ve Z ekseninde çevirme (rotateZ) gibi 2 ve 3 boyutlu dönüşümleri destekler.
CSS3’ün bazı özellikleri hareketlendirilebilir nitelik taşımaktadır ve CSS3’ün animasyon ve dönüşümlerde kullanılabilmesinin sebebi de budur. Hareketlendirilebilir özellikler; boyut, sayı, yüzde ve renk gibi, bir değerden diğerine değişebilir. Bu özelliklerden bazıları; arka plan rengi, arka plan görüntüsü, kenarlık rengi, konum vs.’dir.