خصوصیت vertical-align
مثال (خصوصیت vertical-align)
تراز بندی عمودی تصاویر:
{
vertical-align:text-top;
}
تعریف و کاربرد
با استفاده از خصوصیت vertical-align می توان تراز بندی عمودی یک عنصر را تنظیم کرد.
| مقدار پیشفرض | baseline |
|---|---|
| ارث بری | خیر |
| نسخه | CSS1 |
| JavaScript ساختار | object.style.verticalAlign="bottom" |
پشتیبانی مرورگرها
تمام مرورگرهای اصلی، خصوصیت vertical-align را پشتیبانی می کنند.
توجه: مرورگر Internet Explorer 7 و نسخه های قبلی آن، مقدار "inherit" را پشتیبانی نمی کند. IE8 به !DOCTYPE! نیاز دارد. IE9 مقدار "inherit" را پشتیبانی می کند.
مقدارهای خصوصیت
| مقدار | توضیحات | نمایش دادن |
|---|---|---|
| length |
یک عنصر را به میزان طول مشخص شده، بالا یا پایین می برد. مقادیر منفی نیز قابل قبول است. |
نمایش دادن » |
| % |
یک عنصر را به میزان درصدی از خصوصیت "line-height" بالا یا پایین می برد. مقادیر منفی نیز قابل قبول است. |
نمایش دادن » |
| baseline |
خط پایه عنصر را با خط پایه عنصر والدش هم تراز می کند. این مقدار پیش فرض است. |
نمایش دادن » |
| sub |
عنصر را جوری تراز بندی می کند که گویی زیر نویس به نظر برسد. |
نمایش دادن » |
| super |
عنصر را جوری تراز بندی می کند که گویی بالا نویس به نظر برسد. |
نمایش دادن » |
| top |
لبه بالایی عنصر هم تراز با بلندترین عنصر خط می شود. |
نمایش دادن » |
| text-top |
لبه بالایی عنصر هم تراز با نوشته های عنصر پدرش می شود. |
نمایش دادن » |
| middle |
عنصر در وسط عنصر والدش قرار می گیرد. |
نمایش دادن » |
| bottom |
لبه پایینی عنصر هم تراز با پایین ترین عنصر خط می گردد. |
نمایش دادن » |
| text-bottom |
لبه پایینی عنصر هم تراز با لبه پایینی نوشته های عنصر پدرش می شود. |
نمایش دادن » |
| inherit | تعیین می کند که باید از والدش، ارث بری داشته باشد. |
بیاموزهای مرتبط
CSS Text (بیاموز CSS)
- نوشته شده توسط امیر پهلوان صادق
- بازدید: 11241
