09/11/2008
CSS ile sayfa zeminine hükmedin!
Bu yazıyı Bildirgeç‘ten KAghast yazmıştır.
XHTML’in cazibesinden gözlerinizi kamaştırabilmek için size, CSS kullanarak ne gibi zemin işlemleri (css background) yapabileceğinizi anlatmak istiyorum. Artık HTML etiketlerinde klasik olarak kullandığımız “background” etiket özelliği (property) yerini CSS‘in güçlü background tanımlarına bıraktı.
- Sayfa zeminine tam ekran resim yerleştirme:
Mesela sayfanız zemininde tam ekran olarak görüntülenecek bir görsel kullanmak istiyorsunuz. Ayrıca bu görselin tüm çözünürlüklere göre kendini sayfaya tam olarak yerleştirmesini de bekliyorsunuz. Hiçbir javascript kodu yazmadan sadece buradaki örneği şablon olarak değerlendirerek bunu yapabilirsiniz. Nasıl birşey elde edeceğini tam olarak burdan ve şurdan görebilirsiniz.
- CSS ile filigran (watermark) kullanımı
CSS tanımları sayesinde artık filigranlı (watermark) görseller oluşturmakta çok kolay. Burada, bu konuda çok detaylı ve PHP destekli olarak hazırlanmış bir örnek bulabilirsiniz. Burdaki eğitsel notta ise (tutorial’da ise) PNG resim kullanarak CSS ile nasıl filigran görseller yapabileceğinizi görebilirsiniz.Bu yazıda ise direk filigranlı zemin hazırlamanın yöntemi mevcut.
- CSS‘de zemin konumlandırma (background position)
CSS tanımlarının bize sağladığı en büyük kolaylıklardan biri ise zemin üzerinde tam hakimiyet kurmanızdır. Tanımladığınız zeminin bulunduğu bölge (division) içersindeki X ve Y konumlarını belirtebilirsiniz.
Bu özellikten faydalanarak yine hiç javascript kullanmadan yanıp-sönen (roll over) butonlar hazırlayabilirsiniz. Son olarak konu hakkında özet bilgi niteliğindeki bu yazıya da göz atın.
