Thuộc tính CSS text-indent (thụt lề văn bản) tương tự như thụt dòng đầu tiên của mỗi đoạn văn trong bài luận: nó thụt dòng đầu tiên của mỗi khối văn bản.
Ví dụ cơ bản (đơn vị pixel)
.example {
text-indent: 25px;
}
Áp dụng cho các đoạn văn (<p class="example">) sẽ thụt dòng đầu 25px.
Các đơn vị đo lường khác
Ngoài pixel (px - đơn vị tuyệt đối), bạn có thể dùng các đơn vị tương đối/đáp ứng:
- em: Dựa trên font-size của phần tử cha.
- rem: Dựa trên font-size của root element (
<html>). - %: Phần trăm chiều rộng của phần tử chứa văn bản.
Thử thay 25px bằng 2em, 1.5rem, 5% để xem sự khác biệt. Đơn vị tương đối giúp thiết kế responsive tốt hơn.
Kết luận
text-indent chỉ ảnh hưởng đến dòng đầu tiên của block văn bản. Chọn đơn vị phù hợp với chiến lược responsive của dự án: px cho kiểm soát tuyệt đối, em/rem/% cho thích ứng.