Định nghĩa và sử dụng
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ính | giá trị | Ví dụ | Mô tả |
|---|---|---|---|
| text-align | left | text-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. |
| right | text-align: right; | Sắp nội dung theo chiều ngang nằm về bên phải. | |
| center | text-align: center; | Sắp nội dung theo chiều ngang nằm giữa. | |
| justify | text-align: justify; | Sắp xếp nội dung cho các dòng có chiều rộng bằng nhau. | |
| inherit | text-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ái</p>
<p class="alignCenter">Canh giữa</p>
<p class="alignRight">Canh phải</p>
</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
Không có nhận xét nào:
Đăng nhận xét