Web Cơ Bản

Các thẻ định dạng văn bản trong HTML

- Dưới đây là danh sách những thẻ thường được sử dụng để định dạng cho văn bản.

(các bạn vui lòng tấm vào hình để tìm hiểu chi tiết chức năng và cách sử dụng của từng thẻ)

<b>

- Định dạng chữ in đậm cho văn bản.

<i>

- Định dạng chữ in nghiêng cho văn bản.

<u>

- Tạo một cái đường kẻ ngang nằm dưới chân văn bản.

<s>

- Tạo một cái đường kẻ ngang nằm giữa văn bản.

<big>

- Định dạng chữ to hơn so với văn bản bình thường.

<small>

- Định dạng chữ nhỏ hơn so với văn bản bình thường.

<sup>

- Định dạng chữ nhỏ & nằm ở khoảng nửa trên so với văn bản bình thường.

<sub>

- Định dạng chữ nhỏ & nằm ở khoảng nửa dưới so với văn bản bình thường.

<mark>

- Đánh dấu màu nền nổi bật cho văn bản.

<pre>

- Giữ nguyên định dạng cho văn bản (giống như lúc soạn thảo)

<hr>

- Tạo một cái đường kẻ ngang ngăn cách nội dung phía trên và nội dung phía dưới.

<br>

- Tạo một dấu ngắt xuống dòng.

<bdo>

- Đảo ngược thứ tự xuất hiện của các ký tự.

- Thẻ <b> dùng để định dạng chữ in đậm cho văn bản.

<!DOCTYPE html>
<html>
<head>
	<title>Tiêu đề của trang web</title>
	<meta charset="utf-8">
</head>
<body>
	<p>Học <b>Lập Trình Web</b> miễn phí</p>
</body>
</html>

- Lưu ý: Thẻ <strong> cũng có chức năng & cách sử dụng tương tự.

- Thẻ <i> dùng để định dạng chữ in nghiêng cho văn bản.

<!DOCTYPE html>
<html>
<head>
	<title>Tiêu đề của trang web</title>
	<meta charset="utf-8">
</head>
<body>
	<p>Học <i>Lập Trình Web</i> miễn phí</p>
</body>
</html>

- Lưu ý: Thẻ <em> cũng có chức năng & cách sử dụng tương tự.

- Thẻ <u> dùng để tạo một cái đường kẻ ngang nằm dưới chân văn bản.

<!DOCTYPE html>
<html>
<head>
	<title>Tiêu đề của trang web</title>
	<meta charset="utf-8">
</head>
<body>
	<p>Học <u>Lập Trình Web</u> miễn phí</p>
</body>
</html>

- Lưu ý: Thẻ <ins> cũng có chức năng & cách sử dụng tương tự.

- Thẻ <s> dùng để tạo một cái đường kẻ ngang nằm giữa văn bản.

<!DOCTYPE html>
<html>
<head>
	<title>Tiêu đề của trang web</title>
	<meta charset="utf-8">
</head>
<body>
	<p>Học <s>Lập Trình Web</s> miễn phí</p>
</body>
</html>

- Lưu ý: Thẻ <del> cũng có chức năng & cách sử dụng tương tự.

- Thẻ <big> dùng để định dạng chữ to hơn so với văn bản bình thường.

<!DOCTYPE html>
<html>
<head>
	<title>Tiêu đề của trang web</title>
	<meta charset="utf-8">
</head>
<body>
	<p>Học <big>Lập Trình Web</big> miễn phí</p>
</body>
</html>

- Thẻ <small> dùng để định dạng chữ nhỏ hơn so với văn bản bình thường.

<!DOCTYPE html>
<html>
<head>
	<title>Tiêu đề của trang web</title>
	<meta charset="utf-8">
</head>
<body>
	<p>Học <small>Lập Trình Web</small> miễn phí</p>
</body>
</html>

- Thẻ <sup> dùng để định dạng chữ nhỏ & nằm ở khoảng nửa trên so với văn bản bình thường.

<!DOCTYPE html>
<html>
<head>
	<title>Tiêu đề của trang web</title>
	<meta charset="utf-8">
</head>
<body>
	<p>25<sup>2</sup> + 2<sup>3</sup> = 633</p>
</body>
</html>

- Thẻ <sub> dùng để định dạng chữ nhỏ & nằm ở khoảng nửa dưới so với văn bản bình thường.

<!DOCTYPE html>
<html>
<head>
	<title>Tiêu đề của trang web</title>
	<meta charset="utf-8">
</head>
<body>
	<p>CO<sub>2</sub> + H<sub>2</sub>O = H<sub>2</sub>CO<sub>3</sub></p>
</body>
</html>

- Thẻ <mark> dùng để đánh dấu màu nền nổi bật cho văn bản.

<!DOCTYPE html>
<html>
<head>
	<title>Tiêu đề của trang web</title>
	<meta charset="utf-8">
</head>
<body>
	<p>Học <mark>Lập Trình Web</mark> miễn phí</p>
</body>
</html>

- Lưu ý: Những ký tự nằm bên trong cặp thẻ <mark></mark> sẽ mặc định có nền màu vàng.

- Thẻ <pre> dùng để giữ nguyên định dạng cho văn bản (giống như lúc soạn thảo)

<!DOCTYPE html>
<html>
<head>
	<title>Tiêu đề của trang web</title>
	<meta charset="utf-8">
</head>
<body>
	<pre>Hãy tham gia      diễn đàn HỎI
      ĐÁP LẬP 
      TRÌNH WEB trên Facebook của chúng tôi

      Để được hỗ   trợ giải đáp những    câu hỏi về 

      lĩnh vực    lập trình web 
      một cách nhanh        nhất và tốt 
   nhất</pre>
</body>
</html>

- Thẻ <hr> dùng để tạo một cái đường kẻ ngang ngăn cách nội dung phía trên và nội dung phía dưới.

<!DOCTYPE html>
<html>
<head>
	<title>Tiêu đề của trang web</title>
	<meta charset="utf-8">
</head>
<body>
	<p>Tài liệu học HTML</p>
	<hr>
	<p>Tài liệu học CSS</p>
	<hr>
</body>
</html>

- Thẻ <br> dùng để tạo một dấu ngắt xuống dòng.

<!DOCTYPE html>
<html>
<head>
	<title>Tiêu đề của trang web</title>
	<meta charset="utf-8">
</head>
<body>
	<p>Lập<br>Trình<br><br><br>Web</p>
</body>
</html>

- Thẻ <bdo> dùng để đảo ngược thứ tự xuất hiện của các ký tự.

<!DOCTYPE html>
<html>
<head>
	<title>Tiêu đề của trang web</title>
	<meta charset="utf-8">
</head>
<body>
	<p>12345 được đảo ngược thành <bdo dir="rtl">12345</bdo></p>
</body>
</html>