Deltree Mesaj tarihi: Ekim 28, 2004 Paylaş Mesaj tarihi: Ekim 28, 2004 CSS ile Arkaplanları kontrol etme, Cascading Style Sheets (CSS) arkaplanları kontrol etmemizi sağlayan mükemmel bir tekniktir. Aşağıdaki örnekler web sayfalarınız için çeşitli arkaplan ve metin elemanları içermektedir. Önemli Not: Bütün CSS scriptleri web sayfanızın etiketleri arasına yerleştirilmelidir. İlk örnek nereye yerleştireceğinizi göstermekte, diğer örnekler ise artık öğrendiğiniz varsayılarak hazırlanmıştır. >> Background Color (arkaplan rengi) Head Style 1 Head Style 2 Paragraph Style Sonucu görmek için tıklayın. Burada ne olduğunu farkettiniz mi? Önceden kararlaştırılmış elemanlara arkaplan renkleri atamış olduk (bu durumda H1, H2 ve P etiketlerinden söz ediyoruz.) Dikkat edin H2 ye "transparent" ( şeffaf ) değerini atadık, sadece arkaplan rengini gösterecek. Bu kodu kopyalayın ve değişkenlerle oynayın. >> Background Image (arkaplan resmi) CSS ile arkaplan resmi aşağıdaki gibi ayarlanır. Şimdi neden BODY etiketi yerine CSS kullanacağımızı sorabilirsiniz... çünkü, CSS arkaplan resimlerimizi çeşitli fonksiyonlarla kontrol etmemizi sağlar. Önce hiçbir efekt olmayan bir arkaplan resmi etiketi görelim. Sonucu görmek için tıklayın. >> Background Repeat (arkaplan tekrarı) Bu gerçekten güzel... normalde arkaplan resimleri "tile" halinde yada tüm ekranı tekrarlanan resimlerle doldurarak görüntülenir. CSS ile, görüntüyü dikey yada yatay olarak tekrarlayabilirsiniz. Bunu yapmak için aşağıdaki kodu kullanacaksınız. Sonucu görmek için tıklayın. repeat-y yi repeat-x ile değiştirerek dikey görünümden yataya dönebilirsiniz. Yatay tekrarı görmek için tıklayın. >> Background Position (arkaplan pozisyonu) Diyelim ki, arkaplan resminizi websayfanızın belli bir kısmına koymak istiyorsunuz, örneğin, ortasına. Bunu gerçekleştirmek için sayfanızın x ve y koordinatlarına özellikler atamalısınız. Arkaplanı merkezlemek için aşağıdaki kodu kullanın: Sonucu görmek için tıklayın. ayrıca top center, center bottom, bottom left olarak da deneyin (tıklayarak inceleyebilirsiniz.) >> Background Fixing (arkaplan sabitleme) Bu örnek arkaplanın nasıl sabitleneceğini gösterir. Resim sayfanın diğer kısmıyla birlikte kaymak yerine sabit olacaktır. Bu özellik Netscape tarafından şu anda desteklenmemektedir. [signature][hline]- SlayerTr - - SlayerTr'ye Üye Ol- - SlayerTr'de Chat Yap- - SlayerTr Forumlarını Oku- Link to comment Sosyal ağlarda paylaş Daha fazla paylaşım seçeneği…
Öne çıkan mesajlar