Căn text CSS

Canh văn bản

text-align Thuộc tính được sử dụng để thiết lập cách canh văn bản theo hướng ngang.

Văn bản có thể canh trái, canh phải hoặc canh giữa.

Dưới đây là ví dụ về văn bản được canh giữa và canh trái hoặc phải (nếu hướng văn bản là từ trái sang phải, thì mặc định là canh trái; nếu hướng văn bản là từ phải sang trái, thì mặc định là canh phải):

Ví dụ

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

Thử ngay

Khi text-align Khi thuộc tính được thiết lập thành "justify", mỗi dòng sẽ được kéo dài để mỗi dòng có độ rộng bằng nhau, và lề trái và phải là thẳng (như trong tạp chí và báo in):

Ví dụ

div {
  text-align: justify;
}

Thử ngay

Hướng văn bản

direction và unicode-bidi Thuộc tính này có thể được sử dụng để thay đổi hướng văn bản của yếu tố:

Ví dụ

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

Thử ngay

Đối齐 dọc

vertical-align Thiết lập cách đối齐 dọc của yếu tố.

Ví dụ này minh họa cách thiết lập cách đối齐 dọc của ảnh trong văn bản:

Ví dụ

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

Thử ngay