[Bài 3] Các thẻ HTML và thuộc tính cơ bản trong thẻ

Bạn đang ở bài 3 trong 11 bài của serie Học HTML cơ bản.

Phần này chúng ta cùng tìm hiểu các thẻ và thuộc tính cơ bản trong html, các thẻ và thuộc tính này giúp chúng ta có thể định dạng các đoạn văn bản, hình ảnh…

Như ở bài đầu tiên trong seris học html cơ bản các bạn thấy mình để thẻ <!DOCTYPE HTML> nhưng !DOCTYPE không phải là một thẻ HTML, !DOCTYPE chỉ cho trình duyệt web biết được phiên bản ngôn ngữ đánh dấu (markup language) nào được sử dụng trong trang web.

Chúng ta có 2 dạng thẻ:

  • Thẻ mở (opentag) và thẻ đóng (closetag): <div></div>, <p></p>
  • Thẻ không có thẻ đóng (quick closetag): <input />, <meta />

Các thẻ html cơ bản

  • <html> </html>: Đây là thẻ bao quát website.
  • <head></head>: Đây là thẻ khai báo các thông tin của website.
  • <body></body>: Đây là thẻ trình bày nội dung sẽ hiện thị trên website, thẻ này quan trọng nhất.

3 thẻ này là 3 thẻ bắt buộc phải có trong cấu trúc chuẩn của website. Thẻ <head><body> nằm trong thẻ <html>:

<!DOCTYPE html>
<html lang="vi">
  <head>
    <!-- Khai báo website trong đây -->
  </head>
  <body>
    <!-- Nội dung website trong đây -->
  </body>
</html>

Như các bạn thấy phía trên, ở thẻ <html> mình có thuộc tính lang=’vi’ có nghĩa là khai báo ngôn ngữ tiếng Việt.

Trong thẻ <head> ta sẽ có các thẻ khai báo website:

  • <title></title>
  • <meta />
  • <link />
  • <script></script>
  • <style></style>

Trong thẻ <body> ta có rất nhiều thẻ, ở đây mình sẽ liệt kê 1 số thẻ thông dụng:

  • <div></div>
  • <table></table>
  • <ul></ul>
  • <li></li>
  • <p></p>
  • <a></a>
  • <b></b>
  • <i></i>
  • <strong></strong>
  • <h1></h1>
  • <h2></h2>
  • <form></form>
  • <input />
  • <button></button>
  • …..

Mình sẽ làm ví dụ đơn giản cho các bạn hiểu:

See the Pen Serie học HTML cơ bản – Bài 3 by BlogIT.vn (@blogitvn) on CodePen.

Các thuộc tính cơ bản trong thẻ

Mỗi 1 thẻ trong html sẽ có các thuộc tính mô tả cho nó, thuộc tính có cấu trúc:
name="value"
Ví dụ thuộc tính style trong thẻ p, ở đây mình viết style cho nó là font chữ 25px, màu đỏ và căn lề trái 30px

See the Pen Serie học HTML cơ bản – Bài 3 by BlogIT.vn (@blogitvn) on CodePen.

Ở mỗi thẻ sẽ có các thuộc tính nhất định chỉ chạy được trên thẻ đó, các bạn thêm thẻ khác vào nó không báo lỗi nhưng sẽ không chạy được.

Lời kết:

Ở bài này mình giới thiệu qua và demo các thẻ cơ bản, vẫn chưa đi sâu vào từng thẻ. Ở bài sau mình sẽ chia ra 2 phần để phần tích các thẻ, 1 bài là các thẻ nằm trong <head> và 1 bài là các thẻ nằm trong <body>
Các bạn đón xem bài sau nhé.

[Bài 3] Các thẻ HTML và thuộc tính cơ bản trong thẻ
4 (80%) 2 votes

Từ khóa tìm kiếm:

  • the meta trong body

Bình luận

Hãy trở thành người đầu tiên bình luận!

Thông báo
avatar
wpDiscuz