CSS overflow Özelliği

CSS overflow

Boyutları belirlenen bir html elemanın içeriği kutu boyutunu aştığı durumlarda css overflow özelliği ile gösterimler kontrol edilebilir.Kaydırma çubuklarının çıkıp çıkmayacağını veya çıkacaksada x yönünde mi y yönünde mi kaydırma çubuğu istiyoruz gibi sorularımızı cevaplayan ve çözen bir özelliktir.

Örnek:

Bu css örneğinde iki tane div elemanından bir tanesine scroll diğerine ise hidden değeri verilmiştir.

div.scroll { background-color: yellow; width: 150px; height: 150px; overflow: scroll; } div.hidden { background-color: pink; width: 150px; height: 150px; overflow: hidden; }

CSS overflow nedir nasıl kullanılır

Overflow özelliği ile birlikte içeriğin elementin boyutlarını aşması durumunda kaydırma çubuğunun gösterilip gösterilmeyeceğini kontrol edebiliriz.

CSS overflow CSS overflow özellikleri  
Varsayılan Değer: visible  
Kalıtsallık: yok  
Animasyon Özelliği: yok  
Versiyon: CSS2  
JavaScript overflow: object.style.overflow="scroll"

CSS overflow Tarayıcı Desteği

Tablodaki sayılar özelliği ilk destekleyen tarayıcı versiyonlarını göstermektedir.

CSS Kodu:
overflow 1.0 4.0 1.0 1.0 7.0

CSS overflow Değerleri

overflow:visible|hidden|scroll|auto|initial|inherit;

CSS overflow özelliği değerleri

CSS overflow değerleri CSS overflow değerleri tanımları CSS örnek uygulamalar
visible Taşan içerik görünür.
hidden Taşan içerik gizlenir.
scroll İçerik taştığı zaman kaydırma çubukları görünür.
auto Taşma kesilmiş ise, bir kaydırma çubuğu içeriğin geri kalanını görmek için ilave edilir.
initial Özelliğin varsayılan değeridir.
inherit Kalıtsal olarak aldığı değeri kullanır.  

Yorumlar

Bu blogdaki popüler yayınlar

HTML yorum etiketi ile öğe gizleme örneği

Linklerin Renklerini Değiştirme Örnek

Eski tarayıcılarda kod gizleme ve kod satırını bölme Javascript

YouTube Reklam Engelleyici

HTML Resimler

HTML bdo Etiketi Örnek