English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
بإعداد اتجاه المحور الرئيسي للمساهمات المرنة، يحدد خاصية flex-direction CSS كيفية وضع العناصر المرنة داخل المساهمات المرنة.
الجدول أدناه يوضح كيفية استخدام هذه الخاصية وتاريخ إصداراتها، بالإضافة إلى قواعد استخدامها في سكربتات JavaScript.
| القيمة الافتراضية: | row |
|---|---|
| يُستخدم ل: | المساهمات المرنة |
| الوراثة: | لا يوجد |
| يمكن تحريكه: | لا.يرجى الرجوع إلى خصائص الرسم المتحرك. |
| الإصدار: | أداة جديدة في CSS3 |
| قواعد لغة JavaScript: | الجسم.style.flexDirection="row-reverse" |
نوعية الجملة هي كالتالي:
flex-direction: row | row-reverse | column | column-reverse | initial | inherit
في المثال التالي، يتم عرض كيفية استخدام خاصية flex-direction.
.flex-container {
/* Safari */
display: -webkit-flex;
-webkit-flex-direction: row-reverse;
display: flex;
flex-direction: row-reverse;
}التحقق من ذلك‹/›جدول التالي يصف قيمة هذه الخاصية.
| القيمة | وصف |
|---|---|
| row | محور العنصر الفلزي يتوافق مع محور النص المتدفق للنص، أي اتجاه النص. |
| row-reverse | مثل السطر، ولكن بداية المحور وأساسه معاكس. |
| column | محور العنصر الفلزي يتوافق مع محور السطر الحالي للنص (محور السطر العمودي في نمط الكتابة العمودي ومحور السطر الأفقي في نمط الكتابة الأفقي). |
| column-reverse | مثل العمود، ولكن بداية المحور وأساسه معاكس. |
| initial | وضع هذا الخصائص إلى قيمته الافتراضية. |
| inherit | إذا تم تحديد هذا الخصائص، فإن العناصر ذات الصلة تأخذ قيمة الخاصية flex-direction للعنصر الأم. |
مستوى التطابق للمستعرضات في خصائص flex-direction، الأرقام في الجدول التالي تمثل أحدث إصدار من المستعرضات التي تدعم هذه الخاصية؛ جميع المستعرضات الشائعة يدعمون هذه الخاصية.
|
يرجى الرجوع إلى التعليمات التالية:تخطيط العموديات في CSS3.
خصائص ذات صلة:align-content,align-items,align-self,display,flex,flex-basis,flex-flow,flex-grow,flex-shrink,flex-wrap,justify-content,min-height,min-width,order.