Căn chỉnh bảng CSS
Căn chỉnh theo chiều ngang
Thuộc tính text-align
đặt căn chỉnh theo chiều ngang (như trái, phải hoặc giữa) của nội dung trong <th> hoặc <td>.
Theo mặc định, nội dung của phần tử <th> được căn giữa và nội dung của phần tử <td> được căn trái.
Để căn giữa nội dung của các phần tử <td>, hãy sử dụng text-align: center
:
Tên đầu tiên | Họ | Tiết kiệm |
---|---|---|
Peter | Griffin | 100 USD |
Lois | Griffin | $150 |
Joe | Swanson | $300 |
Để căn trái nội dung, buộc các phần tử <th> phải căn trái, với thuộc tính text-align: left
:
Tên đầu tiên | Họ | Tiết kiệm |
---|---|---|
Peter | Griffin | 100 USD |
Lois | Griffin | $150 |
Joe | Swanson | $300 |
Căn dọc
Thuộc tính vertical-align
đặt căn chỉnh dọc (như trên, dưới hoặc giữa) của nội dung trong <th> hoặc <td>.
Theo mặc định, căn chỉnh theo chiều dọc của nội dung trong bảng là ở giữa (đối với cả phần tử <th> và <td>).
Ví dụ sau đặt căn chỉnh văn bản dọc xuống dưới cùng cho phần tử <td>:
Tên đầu tiên | Họ | Tiết kiệm |
---|---|---|
Peter | Griffin | 100 USD |
Lois | Griffin | $150 |
Joe | Swanson | $300 |