Tìm hiểu Đoạn văn bản trong HTML

03cd82 2024

Cũng giống như trong Word, đoạn văn bản trong HTML dược xác định bởi việc bắt đầu 1 dòng mới và có khoảng cách trống trước đoạn và sau đoạn để phân biệt với các đoạn văn bản khác. 

HTML sử dụng thẻ <p> để viết đoạn văn bản. Mặc định thẻ <p> sẽ có 1 khoảng cách lề ở phía trên và phía dưới để cách đoạn. Bạn cũng có thể dùng CSS để thay đổi khoảng cách này.

<!DOCTYPE html>
<html>
    <head>
          <title>Học HTML tại zezo.dev</title>
          <meta charset="UTF-8">
    </head>
    <body>
		<p>Đoạn văn bản thứ nhất<br>gồm có 2 dòng</p>
		<p>Đoạn văn bản thứ 2 có 1 dòng</p>
		<p>Đoạn văn bản thứ 3</p>
    </body>
</html>

[run_code=html-paragraph]

Bấm chạy thử code trên bạn sẽ thấy kết quả 3 đoạn văn bản cách xa nhau. Thẻ <br> dùng để ngắt dòng trong đoạn nhưng không tạo khoảng cách giữa các dòng.

Khi trình bày nội dung trong 1 bài viết thì nên dùng thẻ <p> để bao gói đoạn văn bản. Ngoài việc tách đoạn, thẻ <p> cũng mang ý nghĩa logic trong văn bản.

Thẻ <hr> dùng tạo đường kẻ ngang

Thẻ này sẽ ngắt đoạn văn bản thành các phần khác nhau và hiển thị giãn cách một khoảng. Về logic thì các phần vẫn nằm trong 1 đoạn, nhưng hiển thị thì thành các khối riêng biệt.

<!DOCTYPE html>
<html>
    <head>
          <title>Học HTML tại zezo.dev</title>
          <meta charset="UTF-8">
    </head>
    <body>
		<p>Đoạn văn bản thứ nhất<hr>gồm có 2 dòng</p>
		<p>Đoạn văn bản thứ 2 có 1 dòng</p>
		<p>Đoạn văn bản thứ 3</p>
    </body>
</html>

 

 

Nguồn: zezo.dev