Thuộc tính text-align trong CSS

Thuộc tính text-align trong CSS

Thuộc tính text-align sắp xếp các nội dung theo chiều ngang.

Cấu trúc

tag {
    text-align: giá trị;
}

Với giá trị như sau:

Thuộc tínhgiá trịVí dụMô tả
text-alignlefttext-align: left;Sắp nội dung theo chiều ngang nằm về bên trái, đây là dạng mặc định.
righttext-align: right;Sắp nội dung theo chiều ngang nằm về bên phải.
centertext-align: center;Sắp nội dung theo chiều ngang nằm giữa.
justifytext-align: justify;Sắp xếp nội dung cho các dòng có chiều rộng bằng nhau.
inherittext-align: inherit;Xác định thừa hưởng thuộc tính từ thành phần cha (thành phần bao ngoài).

Ví dụ

HTML viết:

<html>
<head>head>
<body>
<p class="alignLeft">Canh tráip>
<p class="alignCenter">Canh giữap>
<p class="alignRight">Canh phảip>
body>
html>

Hiển thị trình duyệt khi chưa có CSS:

Canh trái

Canh giữa

Canh phải

CSS viết:

p.alignLeft {
    text-align: left;
}

p.alignCenter {
    text-align: center;
}

p.alignRight {
    text-align: right;
}

Hiển thị trình duyệt khi có CSS:

Canh trái

Canh giữa

Canh phải


Trình duyệt hỗ trợ

Thuộc tính text-align được hỗ trợ trong đa số các trình duyệt. Giá trị "inherit" không hỗ trợ trình duyệt IE7 trở xuống, IE8 đòi hỏi phải có !Doctype.

Bình luận