Ana Sayfa / Kodlama Dilleri / CSS ile Kaydırma Çubuğu Özellikleri

CSS ile Kaydırma Çubuğu Özellikleri

Kaydırma Çubuğunu Özelleştirmek…

İnternet sitemize biraz daha görsellik katmak istersek ilk değiştirmemiz gerekenlerden biri kaydırma çubuklarıdır.

Hepinizin bildiği gibi kaydırma çubukları resimde de gördüğünüz üzere sayfanızın içeriği ekrana sığmadığında ekranın sağ kısmında sayfayı aşağı yukarı oynatmamıza yarayan çubuktur. CSS‘nin nimetlerinden faydalanarak bu kaydırma çubuğunu sitemizin barındırdığı renklere uygun olarak özelleştirebiliriz. Özelleştirme yapmak için öncelikle aşağıda vermiş olduğum kodlara bi göz atalım.

scrollbar-face-color :Kaydırma çubuğunun yüzey rengini belirler , aynı zamanda zemini de etkiler.
scrollbar-base-color :Kaydırma çubuğununun sol ve üst kenarlıklarını çizgi halinde kaplar.
scrollbar-shadow-color :Sağ ve alt kenarlıkların gölge rengini belirler.
scrollbar-highlight-color :Sol ve üst kenarlıkların gölge rengi belirler ve aynı zamanda zemini de etkiler.
scrollbar-arrow-color :Yön oklarının rengini belirler.

Tanımları ile birlikte verdiğimiz şekildeki css tanımlamalarını sitenizin css stil dosyasına yazdığınızda kaydırma çubuğu için istediğinizi elde edebilirsiniz. Her css tanımlamasından sonra (örneğin: scrollbar-shadow-color : #BC4500) renk kodlamasını yazmayı unutmayınız.

Not: Bu CSS kodlaması ile yapacağınız değişiklikler yalnızca internet explorer’da görünür. Diğer internet tarayıcılarında görünmez.

Yorum Yazın

2 Yorumlar

  1. arkadaşlar bişey sorcam kaydırma çubukları css ile nasıl yapılıyo yatay ve dikey olarak kod ve
    etiketlerini tam olarak verirmisiniz

    • ÖÇ deSigneR

      Burada asıl sorulması gereken ne yapmak istediğinizdir. Yani;
      örneğin: css style sayfanıza scrollbar-shadow-color : #BC4500 yazarsanız, sağ ve alt kenarlıkların gölge rengini #BC4500 renginde yapmış olursunuz. Yada başka bir örnekle;
      scrollbar-arrow-color : #007EFF şeklinde yaparsanız, yön oklarının rengini #007EFF renk kodlamasında ki renk ile belirtmiş olursunuz.

      Öncelikle nasıl şekillendireceğinize karar verin. Daha sonra renk kodlarını ve yukarıdaki açıklamaları kullanarak css kodlamanızı oluşturun.

Bir Cevap Yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir