ترازبندی متن CSS

چینش متن

text-align ویژگی برای تنظیم روش چینش متن استفاده می‌شود.

متن می‌تواند در چپ، راست یا وسط قرار گیرد.

مثال زیر نمایش می‌دهد که متن در وسط قرار دارد و یا در چپ و راست قرار دارد (اگر جهت متن از چپ به راست باشد، به صورت پیش‌فرض چپ‌چین است؛ اگر جهت متن از راست به چپ باشد، به صورت پیش‌فرض راست‌چین است):

مثال

h1 {
  text-align: center;
}
h2 {
  text-align: left;
}
h3 {
  text-align: right;
}

آزمایش کنید

وقتی که text-align تنظیمات ویژگی به "justify" تنظیم شود، به هر سطر کشیده می‌شود تا هر سطر دارای عرض یکسانی باشد و حاشیه‌های چپ و راست صاف باشند (مانند مجلات و روزنامه‌ها):

مثال

div {
  text-align: justify;
}

آزمایش کنید

جهت متن

direction و unicode-bidi این ویژگی‌ها برای تغییر جهت متن عنصر استفاده می‌شوند:

مثال

p {
  direction: rtl;
  unicode-bidi: bidi-override;
}

آزمایش کنید

تنظیم عمودی

vertical-align تنظیم روش عمودی تنظیم شده برای عنصر.

این مثال نحوه تنظیم روش عمودی تصویر در متن را نشان می‌دهد:

مثال

img.top {
  vertical-align: top;
}
img.middle {
  vertical-align: middle;
}
img.bottom {
  vertical-align: bottom;
}

آزمایش کنید