ویژگی align-items CSS
- صفحه‌ی قبل جذب‌کننده‌ی محتوا
- صفحه بعدی align-self
تعریف و استفاده
align-items ویژگی align-items برای تعیین روش پیش‌فرض ترازبندی درون مخزن انعطاف‌پذیر استفاده می‌شود.
نکته:از ویژگی هر عنصر استفاده کنید align-self ویژگی‌ها برای پوشش این ویژگی alignItems مراجعه کنید.
لطفاً به:
آموزش CSS:گرید CSS
آموزش CSS:Flexbox CSS
دستورالعمل CSS:ویژگی align-content
دستورالعمل CSS:ویژگی align-self
دستورالعمل CSS:ویژگی justify-content
دستورالعمل CSS:ویژگی justify-items
دستورالعمل CSS:ویژگی justify-self
دستورالعمل HTML DOM:ویژگی alignItems
مثال
تمامی عناصر <div> انعطاف‌پذیر را به صورت مرکزی درون مخزن قرار دهید:
div {
display: flex;
align-items: center;
}
نوع CSS
align-items: stretch|center|flex-start|flex-end|baseline|initial|inherit;
مقدار ویژگی
| مقدار | توضیح |
|---|---|
| stretch | پیش‌فرض. عناصر به گونه‌ای کشیده می‌شوند که با مخزن هماهنگ شوند. |
| center | عنصر در وسط مخزن قرار دارد. |
| flex-start | عنصر در شروع مخزن قرار دارد. |
| flex-end | عنصر در انتهای مخزن قرار دارد. |
| baseline | عنصر در خط پایه‌ی مخزن قرار می‌گیرد. |
| initial | این ویژگی را به مقدار پیش‌فرض خود تنظیم کنید. به: initial. |
| inherit | این ویژگی از عنصر والد خود ارث می‌برد. به: inherit. |
جزئیات فنی
| مقدار پیش‌فرض: | stretch |
|---|---|
| ارث‌برداری: | خیر |
| انیمیشن‌سازی: | پشتیبانی نمی‌شود. لطفاً به:ویژگی‌های مرتبط با انیمیشن. |
| نسخه: | CSS3 |
| نوع جاوااسکریپت: | object.style.alignItems="center" |
پشتیبانی مرورگر
اعداد در جدول نشان‌دهنده‌ی نسخه‌ی اولین مرورگر هستند که از این ویژگی پشتیبانی می‌کند.
| کروم | آندروید | افرایکس | سفاری | опера |
|---|---|---|---|---|
| کروم | آندروید | افرایکس | سفاری | опера |
| 57.0 | 16.0 | 52.0 | 10.1 | 44.0 |
- صفحه‌ی قبل جذب‌کننده‌ی محتوا
- صفحه بعدی align-self
