CSS: Thụt Vô Đầu Dòng Của Đoạn Văn

Thụt Vô Đầu Dòng Của Đoạn Văn

Eiffel tower

Một điểm đơn giản: thụt vô hàng chữ thứ nhứt của mỗi đoạn văn. Nhiều nguời nhận thấy cách trình bày nầy dễ đọc hơn là chừa vài hàng trống chính giữa của hai đoạn văn, đặc biệt là với những đoạn văn dài, điều nầy sẽ cho phép để dành những hàng trống cho các chỗ ngừng quan trọng

Điều cần nhớ là chỉ những đoạn văn nào theo sau đoạn văn thứ nhứt mới cần thụt vô. Đoạn văn thứ nhứt của một trang không cần phải thụt vô, hoặc là những đoạn văn nào mà theo sau một biểu đồ, một tựa đề hay là những phần chữ không thuộc vào bản văn. Thật ra qui tắc thì rất là đơn giản.

p {

  margin-bottom: 0 }

p + p {

  text-indent: 1.5em;

  margin-top: 0 }

Quy tắc thụt vô nầy chỉ cần áp dụng cho những đoạn văn nào mà ở phía sau của một đoạn văn khác.

Quy tắc thụt vô nầy cũng xoá đi khoảng trống ở phía sau các đoạn văn và xóa đi khoảng trống ở phía

truớc của mỗi đoạn văn nào mà bị thụt vô. Tuy nhiên trong thực tế có những truờng hợp ngoại lệ.

Ví dụ, trong trang nầy (xem ví dụ “Hình ảnh & lời chú thích”) P tag đuợc dùng để cộng

thêm chú thích cho bức ảnh. Tag P đã đuợc đặt nằm ở giữa trang, do đó nó không cần phải

thụt vô. Nguyên tắc đơn giản nầy ‘p.caption {text-indent: 0}’ sẽ đảm bảo thực hiện việc

thụt vô. Như bạn đã thấy nguyên tắc nầy đuợc dùng trong ví dụ ở trên.

Bây giờ bạn có thể thêm vài khoảng trống vào những đoạn văn để chỉ ra các

chỗ ngừng quan trọng trong bản văn. Có ba loại ngừng khác biệt: stb (ngừng cho chủ đề nhỏ),

mtb (ngừng cho chủ đề trung bình) và ltb (ngừng cho chủ đề lớn). Bạn có thể thấy đuợc tác

dụng của loại ngừng stb trong đoạn văn nầy.

p.stb { text-indent: 0; margin-top: 0.83em }

p.mtb { text-indent: 0; margin-top: 2.17em }

p.ltb { text-indent: 0; margin-top: 3.08em }