دليل مرجعي CSS

قواعد CSS (RULES)

مجمع خاصيات CSS

طريقة استخدام الخاصية overflow-y في CSS3 ومثال

يحدد الخاصية overflow-y CSS كيفية قطع المحتوى أو عرض شريط التمرير أو عرض المحتوى الزائد عند انسياب المحتوى في العناصر في منطقة المحتوى.

التаблицة التالية توضح استخدام هذا الخصائص وأحداث التاريخ بالإضافة إلى синтكس هذا الخصائص في جافا سكربت.

默认值：	visible
القيمة الافتراضية:	التطبيق:
Block, inline-block و flex containers	الإرث:
لا	يمكن تمريره:لا يرجى الرجوع إلى。
صفات الرسم	الإصدار:
ميزات CSS3 الجديدة	JavaScript.style.overflowY="scroll"

نصابة y-

نصابة هذه الصفة تتمثل فيما يلي:

overflow-y:　visible　|　hidden　|　scroll　|　auto　|　initial　|　inherit

في المثال التالي، يتم عرض كيفية استخدام صفة overflow-y.

مثال

　　div　{
　　　العرض:　400px;
　　　الارتفاع:　300px;
　　　overflow-x:　scroll;
　　}

اختبر لمعرفة‹/›

قيمة الصفة

جدول التالي يصف قيم هذه الصفة.

القيمة	الوصف
visible	لم يتم قطع المحتوى؛ سيتم عرضه خارج حجمة العنصر، وقد يتداخل مع المحتوى الآخر. هذا هو القيمة الافتراضية.
hidden	يتم قطع محتوى العنصر الزائد الحجمة، والباقي غير مرئي.
scroll	يتم قطع المحتوى الزائد كما لو كان مخفيًا، ولكن يقدم آلية التمرير للوصول إلى المحتوى الزائد.
auto	إذا كان المحتوى يتجاوز حجمة العنصر، سيقدم رول لتصفية المحتوى المتبقي.
initial	إعداد هذه الصفة إلى قيمتها الافتراضية.
inherit	إذا تم تحديدها، فإن العنصر المرتبط يأخذ قيمة صفة overflow-y للعنصر الأب.

متاحية البrowser

متاحية الصفة overflow-y للبrowsers، الأرقام في الجدول التالي تعبر عن إصدار أقل من browser يدعم هذه الصفة؛ يدعم جميع browsers الشائعة هذه الصفة.

	Firefox 1.5 وما فوق Google Chrome1+ Internet Explorer 9+ Apple Safari 3+ Opera 9.5+

تحذير: Internet Explorer 7 وأقدم إصداراته لا يدعم صفة overflow-y هذه. يدعم IE8 هذه الصفة، ولكن تحتاج إلى نطاق خاص من Microsoft -ms- (مثل -ms-overflow-y). يدعم إصدارات IE9 وأحدثها.

للإطلاع المزيد

يرجى الرجوع إلى التعليمات التالية:CSS Overflow。

الصفات ذات الصلة:overflow،overflow-x،clip،word-wrap。

خصائص padding CSS خصائص overflow-x CSS3