Text Alignment ng CSS

Text alignment

text-align Ang katangian ay ginagamit upang itakda ang horizontal na alignment ng teksto.

Ang teksto ay maaaring magkaliwa, magkaliwa o magkakitaan sa gitna.

Ang mga sumusunod na halimbawa ay nagpapakita ng text-align sa gitna at sa gilid (kung ang direksyon ng teksto ay mula sa kaliwa papunta sa kanan, ang default ay magkaliwa; kung ang direksyon ng teksto ay mula sa kanan papunta sa kaliwa, ang default ay magkaliwa):

Example

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

Try It Yourself

kapag text-align Pagtatalaga ng "justify" sa halip ay magpapalawak ng bawat linya, upang ang bawat linya ay magkaroon ng pantay na lapad, at ang hanggang gilid ay matapat (katulad sa mga magasin at pahayagan):

Example

div {
  text-align: justify;
{}

Try It Yourself

Text Direction

direction and unicode-bidi Property can be used to change the text direction of the element:

Example

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

Try It Yourself

Vertical Alignment

vertical-align Property sets the vertical alignment of the element.

This example demonstrates how to set the vertical alignment of images in text:

Example

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

Try It Yourself