خصوصیت vertical-align

مثال

تراز بندی عمودی تصاویر:

img
{
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 تعيين مي کند که بايد از والدش، ارث بري داشته باشد.