Giriş yap

CSS overflow Özelliği
CSS2

overflow özelliği, bir öğenin içeriğinin belirtilen bir alana sığmayacak kadar büyük olması durumunda içeriğin kırpılıp kırpılmayacağını veya kaydırma çubukları eklenip eklenmeyeceğini belirler. Yalnızca belirli bir yüksekliğe sahip blok elemanları için çalışır.

Yapısı (Syntax)overflow: visible | hidden | scroll | auto | initial | inherit;

Varsayılan Değer visible
JavaScript Yapısı object.style.overflow="Değer"
Animasyon Özellikleri Uygulanabilir Hayır

Değerler

Değer Açıklama Versiyon
visible Varsayılan değer. CSS2
hidden İçeriğin geri kalanını görünmez yapar. CSS2
scroll Taşma kırpılır, ancak içeriğin geri kalanını görmek için bir kaydırma çubuğu eklenir. CSS2
auto Taşma kırpılırsa, içeriğin geri kalanını görmek için kaydırma çubuğu eklenmelidir. CSS2
initial Varsayılan değerine geri döndürür. CSS2
inherit Değerini üst öğesinden miras alır. CSS2

Örnekler

100px değerinde yükseklik belirledik, belirlediğimiz yüksekliği geçen yazılar için hem dikey, hem de yatay kaydırma çubuğu çıkmış olacak. overflow: auto; dan farkı ise yatay çubuğunda çıkmasıdır.

.element {
	width: 500px;
	height: 100px;
	overflow: scroll;
	background: #f00;
}

100px değerinde yükseklik belirledik, belirlediğimiz yüksekliği geçen yazılar element sınıfının içerisinde kaldığı için belirlediğimiz yükseklikten sonraki yazılar görünmeyecek.

.element {
	width: 500px;
	height: 100px;
	overflow: hidden;
	background: #f00;
}

100px değerinde yükseklik belirledik, yazımız bu yüksekliği geçer ise kaydırma çubuğu çıkar ve o yükseklik doğrultusunda, kaydırma çubuğu ile kaydırılarak yazı görünür.

.element {
	width: 500px;
	height: 100px;
	overflow: auto;
	background: #f00;
}

onuralpkaratas
25 gün önce eklendi.
Github'da Düzenle
Önemli Başlıklar