خصائص flex-grow CSS

التوصيات الدراسية

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

خصائص flex-grow تحدد الكمية التي تنمو فيها العنصر مقارنة بالعناصر الأخرى في نفس الصندوق المرونة.ملاحظة:

إذا لم يكن العنصر مرونة، فإن الخاصية flex غير صالحة.

انظر أيضًا: دليل تعليمات CSS

خصائص flex-shrinkصندوق المرونة CSS

خصائص flex-shrinkخصائص flex

خصائص flex-shrinkخصائص flex-basis

خصائص flex-shrinkخصائص flex-direction

خصائص flex-shrinkخصائص flex-flow

خصائص flex-shrinkدليل CSS

خصائص flex-wrapدليل HTML DOM

خصائص flex-grow

مثال

اجعل عرض العنصر المرونة الثاني يكون ثلاثة مرات أكبر من العناصر المرونة الأخرى:
div:nth-of-type(1) {flex-grow: 1;}
div:nth-of-type(2) {flex-grow: 3;}

div:nth-of-type(3) {flex-grow: 1;}

تجربة شخصية

جافا سكربت: الوصفflex-grow:

|initial|inherit;

قيمة السمة القيمة
الوصف number
ضع هذا السمة في قيمته الافتراضية. انظر رقم، يحدد الكمية التي تنمو فيها هذه العنصر مقارنة بالعناصر الأخرى في الشريط المرونة. القيمة الافتراضية هي 0. ضع هذا السمة في قيمته الافتراضية. انظرخصائص الرسوم المتحركة
من خلال الت属性的 الوالدة. انظر initial من خلال الت属性的 الوالدة. انظرخصائص الرسوم المتحركة

inherit

تفاصيل التقنية القيمة الافتراضية:
0 الوراثة:
لا صنع الرسوم المتحركة:دعم. انظر:خصائص الرسوم المتحركة
. الإصدار:
CSS3 جافا سكربت

object.style.flexGrow="5"

دعم المتصفح

الرقم في الجدول يوضح أحدث إصدار من المتصفح يدعم هذا السمة.

Chrome IE / Edge Firefox Safari Opera
29.0
21.0 -webkit-		 11.0 28.0
18.0 -moz-		 9.0
6.1 -webkit-		 17.0