English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
خصائص CSS3 flex تحدد مكونات الطول المرن. إنها تستخدم لضبطflex-grow,flex-shrinkوflex-basisالخصائص المختصرة للخصائص.
الجدول أدناه يوضح استخدام هذه الخاصية وتاريخ إصداراتها، بالإضافة إلى لغة الاستخدام في سكربتات JavaScript.
| القيمة الافتراضية: | 0 1 auto; عرض جميع الخصائص |
|---|---|
| يُستخدم لـ: | عناصر المروبة |
| الوراثة: | لا |
| قابل للتتحريك: | نعم، لأن كل خاصية مكتوبة بشكل مختصر قابلة للتتحريك.يرجى الرجوع إلى خصائص التحريك. |
| الإصدار: | ميزات CSS3 الجديدة |
| JavaScript syntax: | object.style.flex="1" |
نص النحو لهذه الخاصية هو:
flex: [ flex-grow flex-shrink flex-basis ] | none | auto | initial | inherit
المثال أدناه يوضح كيفية استخدام خاصية flex.
.flex-container {
-webkit-flex: 1; /* Safari 6.1+ */
-ms-flex: 1; /* IE 10 */
flex: 1;
}اختبر هذا‹/›جدول أدناه يصف القيم لهذه الميزة.
| القيمة | الوصف |
|---|---|
| flex-grow | تحديد معامل الزيادة للعنصر المروحي أو الزيادة الإيجابية. |
| flex-shrink | تحديد معامل الشد للعنصر المروحي أو الشد السلبي. |
| flex-basis | تحديد حجم العنصر المروحي بشكل مبدئي. |
| none | يساوي flex 0 0 auto. |
| auto | يساوي flex 1 1 auto. |
| initial | وضع هذا الخصائص إلى قيمته الافتراضية. |
| inherit | إذا تم تحديد هذا، فإن العناصر المرتبطة تستخدم نفس خصائص flex للعنصر الأم. |
مستوى التطابق للميزة flex في متصفحات الويب،الرقم في الجدول أدناه يمثل أحدث إصدار من المتصفح الذي يدعم هذه الميزة؛ جميع المتصفحات الشائعة يدعمون هذه الميزة.
|
يرجى الرجوع إلى التعليمات التالية:تصميم الصفحات المتعددة باستخدام CSS3.
خصائص مرتبطة:align-content,align-items,align-self,display,flex-basis,flex-direction,flex-flow,flex-grow,flex-shrink,flex-wrap,justify-content,min-height,min-width,order.