flex wrap در CSS

flex wrap در CSS

دسته بندی : آموزش CSS سطح مقاله : متوسط زمان مطالعه : 1 دقیقه آخرین بروز رسانی: 21 بهمن 1399

ویژگی flex wrap در CSS محل قرارگیری موارد فلکس را در خطوط ظرف فلکس مشخص می کند:

#first { 
  display: -webkit-flex; /* Safari */ 
  -webkit-flex-wrap: nowrap; /* Safari 6.1+ */ 
  display: flex; 
  flex-wrap: nowrap; 
} 

#second { 
  display: -webkit-flex; /* Safari */ 
  -webkit-flex-wrap: wrap; /* Safari 6.1+ */ 
  display: flex; 
  flex-wrap: wrap; 
}

بررسی flex wrap در CSS

برای استفاده از خاصیت flex-wrap ، باید یکی از سه مقدار موجود را تعریف کنید:

انعطاف پذیر: مقدار؛

تمام مقادیر توضیح داده شده در جدول زیر را مشاهده کنید.

MeaningSyntaxValue
مقدار پیش فرض همه موارد در یک مقدار قرار می گیرند ، حتی اگر در مرزهای ظرف قرار نگیرندflex-wrap: ;nowrapnowrap
این موارد در چندین خط پیچیده می شوند تا در مرزهای ظرف قرار گیرند.
جهت به مقدار جهت انعطاف پذیر بستگی دارد
flex-wrap: wrap;wrap
این موارد در چندین خط پیچیده می شوند تا در مرزهای ظرف قرار گیرند.
جهت مخالف مقدار جهت انعطاف پذیر است
flex-wrap: ;wrap-reservewrap-reverse

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

این تگ در مرورگرهای IE ، safari ، firefox، cherom، opera وEdge پشتیبانی می شود.

در دوره آموزش CSS بین المللی آکادمی دویکس به صورت رایگان ثبت نام کنید.

این مقاله چقدر براتون مفید بود؟

اولین امتیاز را ثبت کنید😊