Tài liệu HTML chạy trực tiếp: In đậm và in nghiêng

Q: Làm sao in đậm chữ trong HTML?

Bọc chữ trong khi những từ đó quan trọng ( Warning: ), hoặc trong khi bạn chỉ muốn chúng nổi bật mà không thêm tầm quan trọng, như tên sản phẩm. Cả hai mặc định đều hiển thị in đậm.

Q: và khác nhau thế nào?

cho biết nội dung quan trọng, nghiêm trọng hoặc khẩn cấp. làm chữ nổi bật mà không hàm ý quan trọng, như từ khóa trong một bản tóm tắt. Hai thẻ trông giống nhau; khác biệt nằm ở ý nghĩa, điều quan trọng với trình đọc màn hình, công cụ tìm kiếm và các lập trình viên khác.

Q: Làm sao in nghiêng chữ trong HTML?

Dùng cho phần nhấn mạnh làm thay đổi nghĩa của câu ("I did say that" với trọng âm ở "did"), và cho chữ mang giọng khác: từ nước ngoài, thuật ngữ kỹ thuật, tên tàu, suy nghĩ. Cả hai đều hiển thị in nghiêng.

Q: Làm sao để chữ vừa in đậm vừa in nghiêng?

Lồng các thẻ vào nhau: text . Đóng chúng theo thứ tự ngược với lúc mở. Với CSS, đặt cả font-weight: bold và font-style: italic trên một phần tử.

Q: Có thể in đậm chữ bằng CSS không?

Có: font-weight: bold (hoặc 700) trên bất kỳ phần tử nào. Dùng CSS khi chữ đậm chỉ để trang trí, như nhãn nút hay kiểu tiêu đề bảng, và dùng thẻ HTML khi bản thân những từ đó quan trọng hoặc được nhấn mạnh.

In đậm, in nghiêng trong HTML: thẻ strong, b, em và i

In đậm chữ trong HTML bằng hoặc , in nghiêng bằng hoặc . Tìm hiểu khi nào dùng thẻ nào, cách kết hợp đậm và nghiêng, và cách in đậm hay in nghiêng bằng CSS.

Trang này có trình soạn thảo chạy trực tiếp. Sửa, chạy và xem đầu ra ngay lập tức.

Bởi Kevin Spektor, Đồng sáng lập và CTO

Đăng ngày Sep 24, 2026

Cách in đậm chữ trong HTML

Bọc chữ trong  hoặc . Cả hai đều làm chữ in đậm:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Bold</title>
  <style>
    body { font-family: system-ui, sans-serif; font-size: 18px; }
  </style>
</head>
<body>
  <p><strong>Warning:</strong> unplug the device before opening it.</p>
  <p>The <b>Pro</b> plan includes offline mode.</p>
</body>
</html>

Chúng trông giống hệt nhau. Khác biệt là điều mỗi thẻ nói về nội dung.

strong và b

Thẻ	Ý nghĩa	Ví dụ
`<strong>`	Nội dung quan trọng, nghiêm trọng hoặc khẩn cấp	`<strong>Do not</strong> share your password.`
`<b>`	Nổi bật, nhưng không thêm tầm quan trọng	Từ khóa trong bản tóm tắt, tên sản phẩm, những chữ mở đầu bài viết

Chọn  khi bạn muốn lên giọng hoặc không muốn người đọc bỏ lỡ. Chọn  khi in đậm là quy ước trình bày cho loại chữ đó. Nếu không thẻ nào hợp và bạn chỉ cần một kiểu chữ, hãy dùng  với một class và CSS.

In nghiêng: em và i

Cặp thẻ in nghiêng theo cùng một ý tưởng:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Italics</title>
  <style>
    body { font-family: system-ui, sans-serif; font-size: 18px; }
  </style>
</head>
<body>
  <p>I <em>never</em> said she took the money.</p>
  <p>I never said <em>she</em> took the money.</p>
  <p>The word <i lang="fr">déjà vu</i> comes from French, and the ship was the <i>Endurance</i>.</p>
</body>
</html>

Thẻ	Ý nghĩa	Ví dụ
`<em>`	Nhấn mạnh trọng âm: đổi vị trí sẽ đổi nghĩa của câu	`I <em>never</em> said that.`
`<i>`	Giọng khác: từ nước ngoài, thuật ngữ kỹ thuật, tên tàu, suy nghĩ	`<i lang="la">et cetera</i>`

Hai câu đầu ở trên dùng cùng các từ nhưng mang nghĩa khác nhau vì vị trí của . Khi  đánh dấu một cụm từ ở ngôn ngữ khác, hãy thêm thuộc tính lang để trình đọc màn hình phát âm đúng.

Một vài thẻ khác mặc định in nghiêng: <cite> (tên một tác phẩm), <dfn> (thuật ngữ đang được định nghĩa), <address> và <var>. Hãy dùng chúng khi phù hợp và để kiểu mặc định lo phần còn lại.

Vừa đậm vừa nghiêng

Lồng thẻ này vào trong thẻ kia, và đóng theo thứ tự ngược lại:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Bold italic</title>
  <style>
    body { font-family: system-ui, sans-serif; font-size: 18px; }
  </style>
</head>
<body>
  <p><strong><em>Bold and italic</em></strong></p>
  <p><em>Italic with a <strong>bold</strong> word inside</em></p>
  <p><b><i>b and i together</i></b></p>
</body>
</html>

text (đóng sai thứ tự) vẫn hiển thị, nhưng trình duyệt phải sửa lại cây phần tử và có thể tách phần tử của bạn ra; xem thẻ HTML để biết việc sửa đó trông thế nào.

In đậm và in nghiêng bằng CSS

Khi kiểu chữ chỉ để trình bày (tiêu đề thẻ, giá tiền, nhãn), hãy dùng CSS ngay trên phần tử thay vì thêm thẻ. font-weight điều khiển độ đậm và font-style điều khiển in nghiêng:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>CSS bold and italic</title>
  <style>
    body { font-family: system-ui, sans-serif; font-size: 18px; }
    .price { font-weight: bold; color: #16a34a; }
    .semi { font-weight: 600; }
    .note { font-style: italic; color: #4b5563; }
    .calm strong { font-weight: normal; color: #dc2626; }
  </style>
</head>
<body>
  <p>Price: <span class="price">$12</span></p>
  <p class="semi">font-weight: 600</p>
  <p class="note">A note set in italics with font-style.</p>
  <p class="calm"><strong>Still strong</strong>, shown in red instead of bold.</p>
</body>
</html>

Dòng cuối cho thấy ý nghĩa và hình thức là hai chuyện riêng:  vẫn giữ ý nghĩa của nó trong khi CSS định dạng nó khác đi. Toàn bộ các độ đậm (từ 100 đến 900) có ở trang CSS font-weight.

Khả năng tiếp cận

Với cài đặt mặc định, hầu hết trình đọc màn hình không đổi giọng cho  hay , nên in đậm và in nghiêng chủ yếu là tín hiệu thị giác. Những gì người dùng không được bỏ lỡ (một lỗi, một trường bắt buộc, một hạn chót) phải rõ ràng từ chính câu chữ, không chỉ từ kiểu chữ. Cũng nên tránh những đoạn dài in nghiêng hay in đậm: chúng khó đọc hơn, nhất là với người đọc mắc chứng khó đọc.

Lỗi thường gặp

Dùng chữ đậm làm tiêu đề. Một dòng chữ  phía trên một phần không phải tiêu đề với trình đọc màn hình. Hãy dùng <h2> hoặc <h3> rồi định dạng nó.
Dùng  để trang trí. Nếu nội dung không có gì quan trọng, hãy dùng  hoặc CSS.
In đậm cả đoạn văn. Nhấn mạnh chỉ hiệu quả khi hiếm. Hãy in đậm một cụm từ, không phải cả đoạn.
Đóng thẻ sai thứ tự. x, không bao giờ là x.
Thẻ cũ. Thẻ  trong các bài hướng dẫn cũ đã lỗi thời. Hãy dùng các thẻ ở trên hoặc font-weight.

Câu hỏi thường gặp

Làm sao in đậm chữ trong HTML?

Bọc chữ trong  khi những từ đó quan trọng (Warning:), hoặc trong  khi bạn chỉ muốn chúng nổi bật mà không thêm tầm quan trọng, như tên sản phẩm. Cả hai mặc định đều hiển thị in đậm.

và khác nhau thế nào?

 cho biết nội dung quan trọng, nghiêm trọng hoặc khẩn cấp.  làm chữ nổi bật mà không hàm ý quan trọng, như từ khóa trong một bản tóm tắt. Hai thẻ trông giống nhau; khác biệt nằm ở ý nghĩa, điều quan trọng với trình đọc màn hình, công cụ tìm kiếm và các lập trình viên khác.

Làm sao in nghiêng chữ trong HTML?

Dùng  cho phần nhấn mạnh làm thay đổi nghĩa của câu ("I did say that" với trọng âm ở "did"), và  cho chữ mang giọng khác: từ nước ngoài, thuật ngữ kỹ thuật, tên tàu, suy nghĩ. Cả hai đều hiển thị in nghiêng.

Làm sao để chữ vừa in đậm vừa in nghiêng?

Lồng các thẻ vào nhau: text. Đóng chúng theo thứ tự ngược với lúc mở. Với CSS, đặt cả font-weight: bold và font-style: italic trên một phần tử.

Có thể in đậm chữ bằng CSS không?

Có: font-weight: bold (hoặc 700) trên bất kỳ phần tử nào. Dùng CSS khi chữ đậm chỉ để trang trí, như nhãn nút hay kiểu tiêu đề bảng, và dùng thẻ HTML khi bản thân những từ đó quan trọng hoặc được nhấn mạnh.

Khái niệm liên quan