خصائص Style flex

التعريف والاستخدام

flex تعين أو رد على طول العنصر، مقارنة بالعناصر الراقصة الأخرى داخل نفس الحاوية.

flex الخصائص هي اختصار لخصائص flexGrow، flexShrink و flexBasis.

التعليق:إذا كان العنصر ليس عنصرًا رقصة، flex الخصائص غير صالحة.

يرجى الرجوع إلى:

دليل CSS:خصائص فليكس

دليل HTML DOM STYLE:خصائص flexBasis

دليل HTML DOM STYLE:خصائص flexDirection

دليل HTML DOM STYLE:خصائص flexFlow

دليل HTML DOM STYLE:خصائص flexGrow

دليل HTML DOM STYLE:خصائص flexShrink

دليل HTML DOM STYLE:خصائص flexWrap

مثال

جعل طول جميع العناصر الراقصة متساوين، بغض النظر عن محتواها:

للمجال i = 0; i < y.length; i++) {
  y[i].style.flex = "1";
}

جرب بنفسك

القواعد

التحقق من خصائص فليكس:

موضوع.style.flex

ضبط خصائص فليكس:

موضوع.style.flex = "flex-grow flex-shrink flex-basis|auto|initial|inherit"

قيمة الخصائص

القيمة الوصف
flex-grow رقم، يحدد مقدار التوسع للمشروع مقارنة بالعناصر الراقصة الأخرى.
flex-shrink رقم، يحدد مقدار الشدوى للمشروع مقارنة بالعناصر الراقصة الأخرى.
flex-basis

طول العنصر.

القيم الصالحة: "أوتوماتيكي"، "تنقل"، أو أي قيمة طولية بحجم "%"، "px"، "em"، أو أي وحدة طول أخرى.
أوتوماتيكي يساوي 1 1 أوتوماتيكي.
initial يساوي 0 1 أوتوماتيكي. يُرجى الرجوع إلى initial.
لا شيء يساوي 0 0 أوتوماتيكي.
تنقل يُنقل هذا الخصائص من عنصر الأب. يُرجى الرجوع إلى تنقل。

تفاصيل التقنية

القيمة الافتراضية: 0 1 أوتوماتيكي
القيمة التي تعود: حرفية، تعبر عن خصائص فليكس。
نسخة CSS: CSS3

دعم المتصفح

كروم إيدج فايرفوكس سفاري أوبرا
كروم إيدج فايرفوكس سفاري أوبرا
الدعم 11.0 الدعم 9.0 الدعم