دليل مرجعي لـ CSS

قواعد CSS @

يحدد خاصية flex-wrap CSS إذا كان يجب وضع عناصر flex في سطر واحد أم وضعهن في سطور أو صفوف متعددة بناءً على المساحة المتاحة في وعاء flex.

الجدول أدناه يوضح استعمال هذه الخاصية و سجله التاريخي بالأصدارات، بالإضافة إلى لغة الاستخدام في سكربتات الجافا سكريبت.

القيمة الافتراضية：	nowrap
للإستخدام:	للإستخدام:
المساحة الإليافية	الوراثة:
لا	يمكن تحريكها:لا يرجى الرجوع إلى。
خصائص التحريك	الإصدار:
ميزات CSS3 الجديدة	JavaScript.style.flexWrap="wrap-reverse"

جملة هذه الخاصية تكون كما يلي:

flex-wrap:　nowrap　|　wrap　|　wrap-reverse　|　initial　|　inherit

المثال أدناه يوضح كيفية استخدام خاصية flex-wrap.

مثال

.flex-container　{
　　　　/*　Safari　*/
　　　　display:　-webkit-flex;
　　　　-webkit-flex-wrap:　nowrap;
　　　　
　　　　display:　flex;
　　　　flex-wrap:　nowrap;
}

جدول أدناه يصف قيمة هذه الخاصية.

القيمة	وصف
nowrap	القيمة الافتراضية. تحديد أن العناصر المتنوعة لن تتم تقسيمها إلى صفوف أو أعمدة.
wrap	تحديد إذا لزم الأمر، سيتم تقسيم العناصر الإليافية إلى صفوف متعددة.
wrap-reverse	مثل wrap، لكن العناصر ستكون في ترتيب عكسي.
initial	اعتماد هذا الخصائص على قيمته الافتراضية.
inherit	إذا تم تحديد، فإن العناصر المرتبطة تستخدم نفس قيمة flex-wrap من العنصر الأم.

تطابق متصفحات الخاصية flex-wrap، الأرقام في الجدول التالي تمثل أحدث إصدار من المتصفح الذي يدعم الخاصية؛ جميع المتصفحات الشائعة يدعمون هذه الخاصية.

	Firefox 18+ ^-moz-،28+ Google Chrome 21+ ^-webkit-،29+ Internet Explorer 11+ Apple Safari 6.1+ ^-webkit- Opera 12.1+

يرجى الرجوع إلى التعليمات التالية:تخطيط صفحات CSS3 المتعددة。