خصوصیت vertical-align

چاپ

مثال (خصوصیت vertical-align)

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

img
{
vertical-align:text-top;
}
خودتان امتحان کنید »

تعریف و کاربرد

با استفاده از خصوصیت vertical-align می توان تراز بندی عمودی یک عنصر را تنظیم کرد.

مقدار پیشفرض baseline
ارث بری خیر
نسخه CSS1
JavaScript ساختار object.style.verticalAlign="bottom"

پشتیبانی مرورگرها

Internet Explorer Firefox Opera Google Chrome Safari

تمام مرورگرهای اصلی، خصوصیت 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)