HTML "overflow: auto" ve "overflow: scroll" arasındaki fark


123

overflowÖzelliğin değerlerini incelerken, şu iki değerle karşılaştım: autove scroll, içerik öğenin dışına taşarsa kaydırma çubukları ekler.

Lütfen birisi bana aralarındaki farkın ne olduğunu açıklayabilir mi?

Yanıtlar:


185

Otomatik, yalnızca herhangi bir içerik kırpıldığında bir kaydırma çubuğu gösterir.

Bununla birlikte, kaydırma, tüm içerik sığsa ve kaydıramasanız bile kaydırma çubuğunu her zaman gösterir.


2
En azından Safari'nin en son sürümünde bir fark görünmüyor: Bununla bile scroll, içerik uygunsa kaydırma çubuğunu görmüyorum. Ancak, emin olmak için gittim autoçünkü yalnızca içerik kırpıldığında bir kaydırma çubuğu göstermek istiyorum.
ma11hew28

1
@MattDiPasquale OS X ve Windows kaydırma çubuklarını farklı şekillerde görüntüler. Muhtemelen Mac'te Safari kullanıyorsunuz değil mi? OS X, siz gerçekten kaydırana kadar genellikle kaydırma çubuğunu gizler.
Johan Davidsson

1
Bundan daha fazla fark var gibi görünüyor overlow: scroll, kutuyu daha ince yapıyor: jsbin.com/letog/2/edit
Dmitri Zaitsev

Kaydırma çubukları hep gösterecek şekilde yapılandırılmış, sürece Safari 12 (muhtemelen önceki sürümleri de) olarak, overflow: scrollve overflow: autoişlevsel olarak aynıdır konteyner içerik barındırdığı yeterince büyük olduğunda.
Luke Worth

15

overflow: scrolltaşan tüm içeriği gizler ve söz konusu öğede kaydırma çubuklarının görünmesine neden olur. İçerik taşmazsa, kaydırma çubukları görünmeye devam edecek, ancak devre dışı bırakılacaktır.

overflow: auto çok benzer, ancak kaydırma çubukları yalnızca içerik taştığında görünür.

Burada , noktayı açıklamak için bazı ekran görüntüleriyle ilgili benzer bir açıklama var .


2

CSS Püf Noktalarına bir göz atın .

Otomatik, yalnızca ve yalnızca içerik taşarsa kaydırma çubuğunu gösterir; ancak kaydırma, içerik dolsa da taşmasa da her zaman kaydırma çubuğunu gösterecektir.



0

overflow: scroll, birine veya diğerine ihtiyacınız olmasa bile hem yatay hem de dikey kaydırma çubuğunu gösterecektir. while, overflow: auto, div'inizin ihtiyaç duyduğu kaydırma çubuğunu gösterir. yani temelde otomatik, her iki scollbar'dan da kurtulmanıza yardımcı olur. İşte bundan daha fazlası:

https://css-tricks.com/the-css-overflow-property/

Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.