Khi thiết kế giao diện với HTML, bạn có thể sử dụng các thẻ định dạng trong HTML để làm cho trang web trông đẹp hơn. Về cơ bản, bằng cách sử dụng các yếu tố được xác định trước để định dạng (không sử dụng CSS), văn bản được cải thiện để mang lại hình ảnh đẹp mắt và thân thiện hơn cho người dùng. Trong số các thẻ được sử dụng nhiều nhất là: văn bản in nghiêng, văn bản in đậm, văn bản được đánh dấu, văn bản quan trọng, văn bản nhỏ hơn, văn bản gạch chân, văn bản được đánh dấu, văn bản đã xóa, chỉ số trên, chỉ số dưới, …
Trong bài hướng dẫn học HTML này, chúng ta sẽ kiểm tra riêng từng thẻ này, giải thích cú pháp của chúng và hiển thị các ví dụ về mã để bạn hiểu rõ hơn cách áp dụng chúng một cách cụ thể.
Thẻ in nghiêng <i> và <em>
Chúng ta sẽ thảo luận về các thẻ HTML <i> và <em> cùng nhau vì cả hai đều định dạng văn bản in nghiêng. Bằng cách sử dụng thẻ <i> , trang web có thể hiển thị nội dung in nghiêng mà không đặt bất kỳ CSS nào lên nội dung đó. Mặt khác, bằng cách sử dụng thẻ <em>, HTML hiển thị văn bản có dấu với tầm quan trọng về mặt ngữ nghĩa. Hãy tạo một ví dụ bằng cách sử dụng các nhãn này. Đây là cách sử dụng các thẻ HTML <i> và <em> :
<p>Văn bản này được in nghiêng</p>
<p style="background-color: #5f9ea0; color: white;">
<i> VIVAWEB là dịch vụ thiết kế website chuyên nghiệp, giá rẻ được thành lập từ năm 2013 bởi Công ty thiết kế web Halink, sau hơn 9 năm phát triển đã phục vụ hơn 7000 khách hàng trong và ngoài nước. </i>
</p>
<p>Văn bản này được nhấn mạnh</p>
<p style="background-color: #6495ed; color: white;">
<em> VIVAWEB là dịch vụ thiết kế website chuyên nghiệp, giá rẻ được thành lập từ năm 2013 bởi Công ty thiết kế web Halink, sau hơn 9 năm phát triển đã phục vụ hơn 7000 khách hàng trong và ngoài nước. </em>
</p>
Và đây là kết quả
Văn bản này được in nghiêng
VIVAWEB là dịch vụ thiết kế website chuyên nghiệp, giá rẻ được thành lập từ năm 2013 bởi Công ty thiết kế web Halink, sau hơn 9 năm phát triển đã phục vụ hơn 7000 khách hàng trong và ngoài nước.
Văn bản này được nhấn mạnh
VIVAWEB là dịch vụ thiết kế website chuyên nghiệp, giá rẻ được thành lập từ năm 2013 bởi Công ty thiết kế web Halink, sau hơn 9 năm phát triển đã phục vụ hơn 7000 khách hàng trong và ngoài nước.
Thẻ HTML <strong>
Thẻ <strong> HTML được sử dụng để hiển thị văn bản in đậm, mang lại tầm quan trọng bổ sung cho văn bản. Dưới đây là một ví dụ về cách sử dụng thẻ HTML <strong> :
<p>Văn bản này được in đậm</p>
<p style="background-color: #483d8b; color: white;">
<strong>
VIVAWEB là dịch vụ thiết kế website chuyên nghiệp, giá rẻ được thành lập từ năm 2013 bởi Công ty thiết kế web Halink, sau hơn 9 năm phát triển đã phục vụ hơn 7000 khách hàng trong và ngoài nước.
</strong>
</p>
Kết quả:
Văn bản này được in đậm
VIVAWEB là dịch vụ thiết kế website chuyên nghiệp, giá rẻ được thành lập từ năm 2013 bởi Công ty thiết kế web Halink, sau hơn 9 năm phát triển đã phục vụ hơn 7000 khách hàng trong và ngoài nước.
Thẻ HTML <sup> và <sub>
Thẻ HTML <sup> đề cập đến chỉ số trên, được đặt phía trên dòng bình thường và nhỏ hơn phần còn lại của văn bản. Trong khi đó, thẻ HTML <sub> đề cập đến chỉ số dưới, được đặt bên dưới đường cơ sở của văn bản và có phông chữ nhỏ hơn. Đây là cách sử dụng các thẻ HTML <sup> và <sub> :
<p>Sử dụng thẻ <b>SUP</b></p>
<p style="background-color: #e0ffff; color: black;">
Nhiệt độ hiện tại là 28<sup>o</sup>C.
</p>
<p>Sử dụng thẻ <b>SUB</b></p>
<p style="background-color: #87cefa; color: black;" >
Đây là thẻ dưới x<sub>2</sub>
</p>
Đây là kết quả của việc sử dụng các thẻ định dạng HTML này:
Sử dụng thẻ SUP
Nhiệt độ hiện tại là 28oC.
Sử dụng thẻ SUB
Đây là thẻ dưới x2
Thẻ HTML <mark>
Thẻ này dùng để đánh dấu một văn bản nhất định trong tài liệu cho mục đích tham khảo và hơn thế nữa. Hãy xem một ví dụ về cách sử dụng thẻ HTML <mark> :
<p>Sử dụng thẻ <b>mark</b></p>
<p>
VIVAWEB là dịch vụ thiết kế website chuyên nghiệp, giá rẻ được thành lập từ năm 2013 bởi Công ty thiết kế web Halink.
<mark> Sau hơn 9 năm phát triển đã phục vụ hơn 7000 khách hàng trong và ngoài nước. </mark>
</p>
Kết quả:
Sử dụng thẻ mark
VIVAWEB là dịch vụ thiết kế website chuyên nghiệp, giá rẻ được thành lập từ năm 2013 bởi Công ty thiết kế web Halink.
Sau hơn 9 năm phát triển đã phục vụ hơn 7000 khách hàng trong và ngoài nước.
Thẻ HTML <small>
Bằng cách sử dụng thẻ <small>, chúng ta có thể giảm kích thước của văn bản xuống kích thước nhỏ hơn kích thước cơ bản, thường được sử dụng nhất trong văn bản liên quan đến thông báo, nhận xét phụ hoặc bản quyền:
<p>Sử dụng thẻ small</p>
<p style="background-color: #db7093; color: black;">
VIVAWEB là dịch vụ thiết kế website chuyên nghiệp, giá rẻ được thành lập từ năm 2013 bởi Công ty thiết kế web Halink.
<small> Sau hơn 9 năm phát triển đã phục vụ hơn 7000 khách hàng trong và ngoài nước. </small></p>
Đây là kết quả của việc chạy mã HTML này:
Sử dụng thẻ small
VIVAWEB là dịch vụ thiết kế website chuyên nghiệp, giá rẻ được thành lập từ năm 2013 bởi Công ty thiết kế web Halink.
Sau hơn 9 năm phát triển đã phục vụ hơn 7000 khách hàng trong và ngoài nước.
Thẻ HTML <del>
Phần tử HTML <del> được sử dụng để hiển thị đoạn văn bản bị gạch ngang tương tự như bị xoá.
<p>Sử dụng thẻ <b>del</b></p>
<p>
VIVAWEB là dịch vụ thiết kế website chuyên nghiệp, giá rẻ được thành lập từ năm 2013 bởi Công ty thiết kế web Halink.
Sau hơn <del>7 năm phát triển</del> 9 năm phát triển đã phục vụ hơn 7000 khách hàng trong và ngoài nước.
</p>
Đây là kết quả của việc sử dụng thẻ <del>:
Sử dụng thẻ del
VIVAWEB là dịch vụ thiết kế website chuyên nghiệp, giá rẻ được thành lập từ năm 2013 bởi Công ty thiết kế web Halink.
Sau hơn 7 năm phát triển 9 năm phát triển đã phục vụ hơn 7000 khách hàng trong và ngoài nước.
>> HTML là gì?
Thẻ HTML <ins>
Bằng cách sử dụng thẻ <ins>, chúng ta có thể định nghĩa một đoạn văn bản đã được thêm vào một tài liệu nào đó, nội dung của thẻ được hiển thị dưới dạng gạch chân. Đây là một ví dụ:
<p>Sử dụng thẻ <b>ins</b></p>
<p>
VIVAWEB là dịch vụ thiết kế website chuyên nghiệp, giá rẻ được thành lập từ năm 2013 bởi Công ty thiết kế web Halink.
<ins>Sau hơn 9 năm phát triển đã phục vụ hơn 7000 khách hàng trong và ngoài nước. </ins>
</p>
Kết quả:
Sử dụng thẻ ins
VIVAWEB là dịch vụ thiết kế website chuyên nghiệp, giá rẻ được thành lập từ năm 2013 bởi Công ty thiết kế web Halink.
Sau hơn 9 năm phát triển đã phục vụ hơn 7000 khách hàng trong và ngoài nước.
Tổng kết
Trong phần hướng dẫn HTML này, các phần tử và thẻ HTML phổ biến và được sử dụng nhiều nhất để sửa đổi và định dạng văn bản đã được đề cập, nhưng danh sách của chúng còn dài hơn nhiều. Với các thẻ định dạng HTML này, chúng ta có thể thêm giao diện đẹp mắt cho trang, làm cho văn bản dễ đọc hơn và dễ dàng gán với mục đích được thiết lập.