Để tạo chữ in đậm HTML, dùng thẻ <b>, thẻ <strong>, hoặc font-weight trong CSS.
Thiết kế trang web, có thể muốn nhấn mạnh đoạn text cụ thể.
Ví dụ: danh sách hướng dẫn dùng công nghệ mới, có cảnh báo bảo mật đặc biệt quan trọng user phải đọc. Muốn nhấn mạnh notice đó đảm bảo user không bỏ lỡ.
Trong HTML, có built-in function cho phép coder in đậm text. Tutorial này phân tích 3 cách phổ biến in đậm text trong HTML: thẻ <b>, thẻ <strong>, và tham số font-weight Cascading Style Sheets (CSS).
Thẻ HTML <b>
Cách phổ biến nhất dev tạo chữ in đậm trong HTML là thẻ <b>. Thẻ <b> tạo element đại diện bold text trên webpage HTML. Ví dụ: <b> highlight subheading trong bài viết online.
Ví dụ <b> hoạt động:
<b>This text is bold</b>
Đơn giản vậy. Muốn in đậm phần text cụ thể nhưng giữ nguyên đoạn văn, bọc <b> quanh phần đó:
<p>This text is not bold. <b>But this text is bold!</b></p>
Kết quả code:
81% người tham gia cảm thấy tự tin hơn về cơ hội việc làm tech sau bootcamp. Được match bootcamp ngay hôm nay.
Trung bình bootcamp grad mất dưới 6 tháng chuyển nghề, từ bắt đầu bootcamp đến việc đầu tiên.
Đầu paragraph bình thường, text trong <b> được in đậm.
Thẻ HTML <strong>
Ngoài ra, dùng thẻ <strong> tạo chữ in đậm trong HTML. <strong> dùng y hệt <b>, có một khác biệt: strong tag chỉ ra nội dung cần sự chú ý đặc biệt. Ví dụ:
<p>Your username for your new computer is <b>JohnAppleseed</b></p> <p><strong>Attention!</strong> You must change your password after logging in.</p>
Code trả về:
Như thấy, <b> highlight text reader có thể muốn đọc. <strong> chỉ ra từ Attention cần chú ý đặc biệt. Ngoài khác biệt này, <b> và <strong> giống nhau.
Thuộc tính CSS font-weight
Thẻ <strong> và <b> dùng trong vanilla HTML chỉ ra text quan trọng nên đọc. Tuy nhiên, có property CSS cho nhiều kiểm soát hơn về hiển thị text: font-weight.
font-weight cho phép coder quyết định text nặng/nhẹ đến mức nào – in đậm bao nhiêu. Ví dụ font-weight áp dụng cho paragraph với class thick:
HTML:
<p>This is an example paragraph.</p> <p class="thick">This is a bold example paragraph.</p>
CSS:
p.thick { font-weight: 900; }
Kết quả:
Ví dụ: định nghĩa class thick set font-weight = 900 → text tham chiếu class thick hiển thị in đậm. Có thể tùy chỉnh số "900" tùy muốn text nhẹ hoặc đậm hơn.
Hoặc chỉ định font-weight qua attribute style font-weight bold:
<p>This is an example paragraph.</p> <p style="font-weight:900;">This is a bold example paragraph.</p>
Kết luận
Chữ in đậm là phần quan trọng định dạng text trong HTML. Cần thu hút chú ý vào dòng text hoặc vài từ cụ thể → in đậm. Tutorial này phân tích 3 cách chính in đậm: <b>, <strong>, và font-weight. Bây giờ bạn sẵn sàng tạo chữ in đậm như chuyên gia!