Đoạn văn trong HTML

Trong HTML, phần tử <p> xác định một đoạn văn:

Ví dụ

<p>This is a paragraph.</p>
<p>This is another paragraph.</p>

Lưu ý: Trình duyệt tự thêm một khoảng trắng (thêm lề) phía trước và sau một đoạn văn.

Hiển thị HTML

Bạn không thể chắc chắn cách mà HTML sẽ được hiển thị.

Màn hình lớn hoặc nhỏ, hay thay đổi kích thước cửa sổ sẽ tạo ra các kết quả khác nhau.

Với HTML, bạn không thể thay đổi đầu ra (cách hiển thị) bằng cách thêm khoảng trắng hoặc thêm dòng trong mã HTML.

Trình duyệt sẽ loại bỏ mọi khoảng trắng và dòng thừa khi trang được hiển thị.

Ví dụ

<p>
This paragraph
contains a lot of lines
in the source code,
but the browser
ignores it.
</p>

<p>
This paragraph
contains         a lot of spaces
in the source         code,
but the        browser
ignores it.
</p>

Đừng quên thẻ đóng

Phần lớn trình duyệt sẽ hiển thị đúng HTML ngay cả khi bạn quên thẻ đóng:

Ví dụ

<p>This is a paragraph.
<p>This is another paragraph.

Ví dụ trên sẽ hoạt động trên hầu hết trình duyệt, nhưng đừng ỷ lại vào nó. Bỏ qua thẻ đóng có thể tạo ra kết quả không mong muốn hoặc các lỗi không đáng có.

Ngắt dòng

Trong HTML, phần tử <br> định nghĩa một lần ngắt dòng.

Dùng thẻ <br> nếu bạn muốn ngắt dòng (xuống dòng mới) mà không cần phải bắt đầu một đoạn văn khác.

Ví dụ

<p>This is<br>a paragraph<br>with line breaks.</p>

Thẻ <br> là một thẻ đơn, nên nó không có thẻ đóng.

Vấn đề với những bài thơ

Đoạn thơ sau sẽ được hiển thị trên cùng một dòng:

Ví dụ

<p>
  My Bonnie lies over the ocean.

  My Bonnie lies over the sea.

  My Bonnie lies over the ocean.

  Oh, bring back my Bonnie to me.
</p>

Phần tử <pre>

Trong HTML, phần tử <pre> xác định văn bản được định dạng sẵn.

Văn bản bên trong phần tử <pre> sẽ được hiển thị với một font có động rộng cố định (thường là Courier), và nó giữ nguyên các khoảng trắng và ngắt dòng:

Ví dụ

<pre>
  My Bonnie lies over the ocean.

  My Bonnie lies over the sea.

  My Bonnie lies over the ocean.

  Oh, bring back my Bonnie to me.
</pre>

Bảng tham khảo

Trích nguồn từ: (https://www.w3schools.com/html/html_paragraphs.asp)