Định dạng đoạn văn (paragraphs) luôn là một vấn đề quan trọng trong bất kỳ tài liệu, văn bản nào. Để hiểu và vận dụng thành thạo thẻ <p> trong HTML không phải vấn đề quá khó khăn. Trong bài học này, các bạn sẽ tìm hiểu cách sử dụng thẻ <p> và kết hợp với một số thẻ khác để tăng hiệu quả trình bày của đoạn văn.
Cú pháp: <p>Đoạn văn cần định dạng</p>
Ví dụ 1:
<!DOCTYPE html>
<html>
<head>
<title>http://minhhienict.blogspot.com/</title>
</head>
<body>
<p>Đoạn văn thứ 1</p>
<p>Đoạn văn thứ 2</p>
</body>
</html>
Kết quả:
7.2. Thẻ <p> tự động loại trừ ký tự cách và xuống dòng.
Ví dụ 2:<!DOCTYPE html>
<html>
<head>
<title>http://minhhienict.blogspot.com/</title>
</head>
<body>
<p>
Đây là một đoạn văn
chứa rất nhiều ký tự cách, xuống dòng
trong mã nguồn HTML, nhưng các trình
duyệt web vẫn hiển thị đoạn trên cùng
một dòng
</p>
<p>
Đây là một đoạn văn
chứa rất nhiều ký tự cách,
xuống dòng trong mã nguồn HTML
, nhưng các trình duyệt web vẫn hiển
thị đoạn trên cùng
một dòng
</p>
</body>
</html>
Kết quả:
Ví dụ 3:
<!DOCTYPE html>
<html>
<head>
<title>http://minhhienict.blogspot.com/</title>
</head>
<body>
<p>Đây là <br>một đoạn<br>văn được viết ngắt dòng</p>
</body>
</html>
Kết quả:
Ví dụ 4:
<!DOCTYPE html>
<html>
<head>
<title>http://minhhienict.blogspot.com/</title>
</head>
<body>
<p>Đoạn thơ này sẽ được hiển thị trên một dòng:</p>
<p>
Anh đợi em về ăn cơm.
Trăng đã lên rồi, trăng sáng.
Mảnh ngọc trên cây hoàng lan.
Chắc thấy em trên đường vắng.
</p>
</body>
</html>
Kết quả:
Ví dụ 5:
<!DOCTYPE html>
<html>
<head>
<title>http://minhhienict.blogspot.com/</title>
</head>
<body>
<p>Thẻ pre chấp nhận các khoảng trống và ký tự xuống dòng</p>
<pre>
Anh thương em khi ngủ
Phong thái rất hồn nhiên.
Em ngủ như trẻ nhỏ
Ngon say một giấc liền.
</pre>
</body>
</html>
Kết quả:
0 on: "[HTML] Bài 7: Thẻ định dạng đoạn văn bản (P - Paragraphs)"