خصوصیت box-direction
مثال (خصوصیت box-direction)
فرزندان div در این مثال، در جهت معکوس نمایش داده می شوند:
div
{
width:350px;
height:100px;
border:1px solid black;
/* Internet Explorer 10 */
display:-ms-flexbox;
-ms-flex-direction:row-reverse;
/* Firefox */
display:-moz-box;
-moz-box-direction:reverse;
/* Safari, Opera, and Chrome */
display:-webkit-box;
-webkit-box-direction:reverse;
/* W3C */
display:box;
box-direction:reverse;
}
خودتان امتحان کنید »{
width:350px;
height:100px;
border:1px solid black;
/* Internet Explorer 10 */
display:-ms-flexbox;
-ms-flex-direction:row-reverse;
/* Firefox */
display:-moz-box;
-moz-box-direction:reverse;
/* Safari, Opera, and Chrome */
display:-webkit-box;
-webkit-box-direction:reverse;
/* W3C */
display:box;
box-direction:reverse;
}
پشتیبانی مرورگرها
هیچ کدام از مرورگرهای اصلی، خصوصیت box-direction را پشتیبانی نمی کنند.
مرورگر Internet Explorer 10 به پیشوند -ms- نیاز دارد.
مرورگر Firefox به پیشوند -moz- نیاز دارند.
مرورگرهای Chrome و Safari به پیشوند -webkit- نیاز دارند.
توجه: مرورگر Internet Explorer 9 و نسخه های قبلی آن، این امکان را پشتیبانی نمی کند.
تعریف و کاربرد
با استفاده از خاصیت box-direction، جهت چینش فرزندان یک عنصر box را می توان مشخص کرد.
| مقدار پیشفرض | normal |
|---|---|
| ارث بری | خیر |
| نسخه | CSS3 |
| JavaScript ساختار | object.style.boxDirection="reverse" |
نحوه استفاده
box-direction: normal|reverse|inherit;
| مقدار | توضیحات | نمایش دادن |
|---|---|---|
| normal |
فرزندان را در جهت پیش فرض نمایش می دهد. |
نمایش دادن » |
| reverse |
فرزندان را در جهت معکوس نمایش می دهد. |
نمایش دادن » |
| inherit | تعیین می کند که باید از والدش، ارث بری داشته باشد. |
- نوشته شده توسط امیر پهلوان صادق
- بازدید: 6436
