تعریف و کاربرد
خاصیت align-content تعیین می کند خطوط منعطف یا همان flex-line ها به چه صورت در یک محور پخش شوند.
در چیدمان flex box ها 2 حالت وجود دارد:
- محور اصلی که به صورت افقی می باشد.
- محور متقاطع که به صورت عمودی می باشد.
اطلاعات
| # | توضیحات |
|---|---|
| مقدار پیشفرض | کشیده |
| ارث بری | خیر |
| انیمیشن | خیر |
| نسخه | CSS3 |
| نگارش JS | object.style.alignContent="وسط" |
سازگاری با مرورگر
اعدادی که در فیلد های مرورگر ها درج شده اند، بیانگر ورژن ساپورت کننده خاصیت align-content هستند.
| # | کروم | ادج | فایرفاکس | سافاری | اپرا |
|---|---|---|---|---|---|
| align-content |
شیوه نگارش
مقادیر
| مقادیر | توضیحات |
|---|---|
| stretch | خطوط را به صورت کشیده ایجاد می کند و فضای خالی را اشغال می کند. |
| center | خطوط را به سمت مرکز محفظه flex بسته بندی می کند. |
| flex-start | خطوط را به سمت بخش شروع محفظه flex بسته بندی می کند. |
| flex-end | خطوط را به سمت بخش پایانی محفظه flex بسته بندی می کند. |
| space-between | خطوط را به صورت مساوی در محفظه flex تفسیم میکند. |
| space-around | خطوط را به صورت مساوی با فاصله های کوتاه در دو طرف محفظه flex تفسیم میکند. |
| space-evenly | خطوط را به صورت مساوی با فاصله های مساوی در دو طرف محفظه flex تفسیم میکند. |
| initial | خطوط را به صورت پیش فرض تنظیم می کند. |
| inherit | ویژگی تنظیمات خطوط را از تگ واحد خود به ارث می برد. |
صفحات مرتبط
آموزش CSS: CSS flexbox
آموزش CSS: شبکه CSS
مرجع CSS: ویژگی align-items
مرجع CSS: ویژگی align-self
مرجع CSS: ویژگی justify-content
مرجع HTML DOM: ویژگی alignContent
