ویژگی Style flex

تعریف و استفاده

flex ویژگی مقدار آیتم را تنظیم یا بازمی‌گرداند، در مقایسه با آیتم‌های انعطاف‌پذیر دیگر درون همان قالب.

flex ویژگی یک ویژگی خلاصه‌سازی از ویژگی‌های flexGrow، flexShrink و flexBasis است.

نکته:اگر عنصر آیتم انعطاف‌پذیر نباشد، flex ویژگی نامعتبر است.

لطفاً به

دستورالعمل CSSویژگی flex

دستورالعمل 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";
}

آزمایش کنید

جملات

ویژگی flex بازمی‌گرداند:

موضوع.style.flex

ویژگی flex تنظیم می‌کند:

موضوع.style.flex = "flex-grow flex-shrink flex-basis|خودکار|initial|از پدر"

مقدار ویژگی

مقدار توضیح
flex-grow عدد، مقدار افزایش آیتم‌ها را در مقایسه با آیتم‌های انعطاف‌پذیر دیگر مشخص می‌کند.
flex-shrink عدد، مقدار کاهش آیتم‌ها را در مقایسه با آیتم‌های انعطاف‌پذیر دیگر مشخص می‌کند.
flex-basis

طول آیتم‌ها.

مقدارهای مجاز: "خودکار"، "از پدر"، یا مقادیری با واحد "%"، "px"، "em"، یا هر واحد طول دیگری.

خودکار معادل 1 1 خودکار است.
initial معادل 0 1 خودکار است. به initial مراجعه کنید.
هیچ‌چیزی معادل 0 0 خودکار است.
از پدر این ویژگی را از عنصر پدر خود ارث می‌برد. لطفاً به از پدر

جزئیات فنی

مقدار پیش‌فرض: 0 1 خودکار
مقدار بازگشتی: زنجیره حروف، که طول عناصر را نشان می‌دهد ویژگی flex
نسخه CSS: CSS3

پشتیبانی مرورگر

کروم ایج فایرفاکس سافاری آپرا
کروم ایج فایرفاکس سافاری آپرا
پشتیبند 11.0 پشتیبند 9.0 پشتیبند