Những điều cần biết về thẻ HTML

Thẻ HTML là một công cụ cần thiết để thiết kế nên các website tĩnh. Việc áp dụng HTML giúp trang web có cấu trúc tốt và chạy ổn định trên hầu hết các trình duyệt khác nhau. Dưới đây là những thông tin cơ bản về loại ngôn ngữ này mà bạn cần biết trước khi bắt tay vào xây dựng web. 

Những điều cần biết về thẻ HTML
Những điều cần biết về thẻ HTML

1. Thế nào là HTML?

HTML – HyperText Markup Language (Ngôn ngữ đánh dấu siêu văn bản) là một ngôn ngữ đánh dấu dùng để tạo nên các website. Nhiệm vụ chính của HTML là để thiết kế bố cục cho các thành phần trong ứng dụng hoặc trang web, quy định cách thức hiển thị heading, các đoạn text, links,…

Mỗi trang trên website có thể coi là một tài liệu HTML. Tài liệu này được cấu thành bởi các phần tử HTML được quy định bằng những cặp thẻ (tag), lưu dưới dạng đuôi mở rộng là .htm hay .html. Các cặp thẻ nằm trong ngoặc nhọn, thường được khai báo theo cặp. Hầu hết các thẻ HTML đều gồm 3 phần: thẻ đóng, thẻ mở và nội dung. Nội dung đánh dấu bằng HTML được khai báo bên trong cặp thẻ. Tuy nhiên vẫn có một số ngoại lệ với một số thẻ HTML khi chúng không có thẻ đóng. 

Phiên bản cập nhật mới nhất của ngôn ngữ đánh dấu này là HTML5. 

2. Chức năng của HTML

Như đã nói ở trên, HTML quy định cấu trúc cơ bản của một trang web, làm nhiệm vụ phân chia và sắp xếp bố cục của các thành phần. Đồng thời, ngôn ngữ này cũng hỗ trợ khai báo các tập tin đa phương tiện như hình ảnh, video hoặc âm thanh. 

HTML quy định định dạng và bố cục của các thành phần trên website
HTML quy định định dạng và bố cục của các thành phần trên website

HTML giúp tạo nên một trang web tĩnh hoàn chỉnh, phù hợp với đa số trình duyệt phổ biến hiện nay. Ngôn ngữ đánh dấu này cũng có thể tích hợp dễ dàng với các loại ngôn ngữ lập trình backend như Node.js hay PHP để tạo tính năng động cho web.

3. Các loại thẻ HTML 

Ta có thể phân chia các thẻ HTML thành 2 loại chính là Block-level và Inline. 

3.1. Block-level

Một thẻ block-level luôn bắt đầu trên một dòng mới, chiếm toàn bộ không gian chiều rộng của website bằng cách dàn trải sang 2 bên trái/phải hết mức có thể. 

Một vài ví dụ có thể kể đến như:

  • <main>: quy định nội dung chính của tài liệu. Một tài liệu chỉ có một thẻ <main>.
  • <header>: đại diện cho vùng chứa nội dung giới thiệu hoặc tổ hợp các liên kết điều hướng. Thẻ <header> có thể chứa các thẻ tiêu đề từ <h1> đến <h6>, logo, thông tin về quyền tác giả. Một tài liệu HTML có thể có nhiều thẻ <header>.
  • <footer>: quy định chân trang của một đoạn hoặc một tài liệu. Thẻ này chứa thông tin về quyền tác giả, bản quyền, liên hệ, sơ đồ web, quay lại liên kết đầu và các tài liệu liên quan. Một tài liệu có thể có nhiều thẻ <footer>.
  • <div>: xác định một phần hoặc một đoạn trong một tài liệu HTML. Thẻ này được dùng làm vùng chứa cho những phần tử HTML mà sau đó sẽ được thao tác với JavaScript hoặc tạo kiểu cách bằng CSS. 
Ví dụ với thẻ <div>

3.2. Inline

Loại thẻ HTML này không bắt đầu trên một dòng mới và nó chỉ chiếm dụng không gian theo chiều rộng khi cần thiết. Dưới đây là một vài ví dụ của thẻ inline trong HTML: 

  • <img>: chèn hình ảnh vào trang web. Nó tạo một không gian lưu trữ cho hình ảnh được tham chiếu.
  • <a>: xác định một siêu liên kết giữa một trang với các trang khác.
  • <strong>: xác định văn bản quan trọng. Nội dung của văn bản được hiển thị dưới dạng chữ in đậm.  
  • <em>: xác định văn bản nổi bật. Nội dung của văn bản được hiển thị dưới dạng chữ in nghiêng.  
Ví dụ với thẻ <em>

Việc xây dựng nên một website hoàn thiện không thể thiếu sự hỗ trợ của HTML. Dù bạn sử dụng bất cứ loại ngôn ngữ lập trình nào thì cũng vẫn phải cần đến HTML để có thể xử lý và hiển thị dữ liệu của trang web trên các trình duyệt. Hãy tìm hiểu thật kỹ thông tin về HTML, cũng như các loại thẻ HTML thích hợp để định dạng các thành phần trên website của mình nhé. 

Nếu bạn quan tâm, hãy xem các vị trí đang tuyển dụng của Got It tại: bit.ly/gotit-hanoi và đọc thêm về quy trình tuyển dụng tại đây.

https://vn.got-it.ai/blog/wp-content/uploads/2021/04/1_QAG9RXQyyMAY7i9OYo84FA.png
Got It Vietnam
February 07, 2021
Share this post to:
Tags:
0 Comments
Inline Feedbacks
View all comments
Các bài viết liên quan
Những code HTML cơ bản nhất

Những code HTML cơ bản nhất

Loại code HTML cơ bản dễ học nhất hiện nay là gì? Những người lập trình viên mới vào nghề thường khá lúng túng không biết nên bắt đầu học từ đâu và học gì dễ hiểu dễ thực hành nhất. Bài viết này sẽ chia sẻ đến bạn những thẻ HTML đơn giản và […]
Ngôn ngữ HTML là gì? Tìm hiểu cấu trúc HTML

Ngôn ngữ HTML là gì? Tìm hiểu cấu trúc HTML

Cấu trúc HTML mạch lạc, khoa học giúp cho website hoạt động ổn định. Hiện nay, mỗi website đều được xây dựng với những cấu trúc khác nhau. Vậy khi phát triển website, lập trình viên nên xây dựng cấu trúc ngôn ngữ web HTML như thế nào? Got It sẽ chia sẻ những thông […]
Giới thiệu về HTML – ngôn ngữ web phổ biến nhất hiện nay

Giới thiệu về HTML – ngôn ngữ web phổ biến nhất hiện nay

Những thông tin giới thiệu về HTML sẽ giúp những người mới học lập trình trau dồi kiến thức cơ bản. Hiện nay có rất nhiều loại ngôn ngữ web mới với những ưu điểm nổi bật, nhưng HTML vẫn là loại ngôn ngữ được nhiều lập trình viên ưu tiên sử dụng. Cùng tìm […]
Thẻ style trong HTML là gì? Các thuộc tính trong thẻ style

Thẻ style trong HTML là gì? Các thuộc tính trong thẻ style

Style trong HTML là một thuộc tính đặc biệt dùng để khai báo các định dạng cho thẻ HTML như màu sắc, font chữ, cỡ chữ, màu nền,… Bài viết này sẽ chia sẻ những kiến thức cơ bản về thẻ style và một số thuộc tính của thẻ này.    Mục lục1. Thẻ style trong […]
Stylesheet là gì? Chức năng và lợi ích của Stylesheet

Stylesheet là gì? Chức năng và lợi ích của Stylesheet

Trước đây, khi mỗi trang web được hiển thị, người ta không thể thay đổi bất cứ thứ gì trên đó. Bài viết này sẽ chia sẻ kiến thức Stylesheet là gì và khả năng hỗ trợ của nó trong HTML động nhằm thực hiện những thay đổi trên trang. Mục lục1. Khái niệm Stylesheet […]
Hướng dẫn cách chèn thẻ video trong HTML

Hướng dẫn cách chèn thẻ video trong HTML

Thẻ video trong HTML là câu lệnh được sử dụng để chèn “trình xem phim” cho một website nào đó. Dòng lệnh này không quá khó để thực hiện. Tuy nhiên, chúng vẫn cần độ chính xác cao nhằm tối ưu hóa website của bạn một cách tốt nhất. Cách chèn thẻ video trong HTML […]