Code HTML là gì

Bài 2: Các khái niệm thường gặp trong HTML

Ở bài trước, chúng ta đã tìm hiểu được HTML là gì và nó có vai trò như thế nào trong lập trình web. Ở bài này, chúng ta sẽ cùng nhau đi tìm hiểu một số khái niệm hay gặp trong HTML, để trong các bài viết sau này của mình bạn sẽ dễ hiểu hơn.

I. HTML document

HTML document tức là tài liệu HTML (đôi khi mình gọi là tệp tin HTML) là một tập tin có phần mở rộng là .html, hoặc .htm với nội dung được xây dựng từ các thành phần của HTML.

Mỗi một tài liệu HTML hoàn chỉnh thường đại diện cho một trang web. Bạn có thể xem ví dụ về một tài liệu HTML hoàn chỉnh ở ví dụ dưới đây:

Một tài liệu HTML cần tuân theo một cấu trúc nhất định, cụ thể như thế nào thì mình sẽ gửi tới bạn ở bài viết tiếp theo.

II. HTML tag

Nhìn lại ví dụ về tài liệu HTML ở trên, bạn sẽ thấy có một cấu trúc chung được sử dụng khá nhiều đó là:

Ví dụ như <title>Page Title</title> <h2>Hello, world!</h2> chẳng hạn, nó đều tuân theo cấu trúc mà mình chỉ ra ở trên. Thì mỗi một cái <tagname> hoặc </tagname> như vậy thì được gọi là một thẻ HTML (hay HTML tag).

Thẻ trong HTML chia ra làm 2 loại thẻ:

• Thẻ mở: là thẻ bắt đầu cho việc đánh dấu một phần tử nào đó, là thẻ mà không có ký tự /.
• Thẻ đóng: là thẻ đánh dấu kết thúc cho một phần tử nào đó, là thẻ xuất hiện ký tự /.

Có một số thẻ HTML không có thẻ đóng, nó chỉ sử dụng để đánh dấu cho một phần tử nhất định, ví dụ thẻ <br> để đánh dấu một phần tử xuống dòng, thẻ <hr> dùng để đánh dấu một đường kẻ ngang màn hình.

Mỗi một thẻ HTML thì có nhiệm vụ đánh dấu cho một loại phần tử trên trang web. Ví dụ:

• Thẻ <img> đánh dấu cho một phần tử ảnh, sử dụng thẻ <img> nếu bạn muốn chèn hình ảnh lên trang web.
• Thẻ <p> đánh dấu cho một đoạn văn bản, sử dụng thẻ <p> nếu bạn muốn chèn một đoạn văn bản lên trang web.
• Thẻ <a> đánh dấu cho một đường link, sử dụng thẻ <a> nếu bạn muốn chèn link lên trang web.

Thẻ trong HTML khá đa dạng, có tất cả tới mấy trăm thẻ lận, với mỗi thẻ lại đánh dấu cho một loại phần tử khác nhau. Tuy nhiên chỉ có đâu đó khoảng 20 chục thẻ là thường xuyên sử dụng, số còn lại chỉ để tham khảo thêm.

Đối với các thẻ HTML phổ biến, mình cũng sẽ có bài viết trình bày cụ thể với bạn sau.

III. HTML attribute

HTML attribute (thuộc tính HTML) là những tùy chỉnh đối với các thẻ trong HTML.

Ví dụ mình có thẻ <font> được sử dụng khi bạn muốn định dạng lại font chữ trên trang web, và nó có một thuộc tính là color được sử dụng để định dạng màu sắc cho văn bản của bạn.

Nhưng cái tương tự như color nằm trong thẻ font trên thì được gọi là thuộc tính HTML (HTML attribute).

Phát biểu một cách tổng quát, thì thuộc tính HTML sẽ luôn nằm trong các thẻ HTML mở, và có dạng như:

Lưu ý: Thẻ HTML và thuộc tính HTML có mối quan hệ mật thiết với nhau. Một số thuộc tính có thể sử dụng cho rất nhiều thẻ, nhưng cũng có những thuộc tính chỉ dành cho một số thẻ nhất định. Có những thuộc tính là bắt buộc phải có đối với một số thẻ, nhưng cũng có thể là tùy chọn (có hoặc không) đối với một số thẻ.

Ví dụ

• Thuộc tính title, thuộc tính này có thể sử dụng trong tất cả các thẻ HTML, được sử dụng khi bạn muốn giải thích thêm về phần một phần tử HTML nào đó.
• Thuộc tính href là thuộc tính để chưa đường link cho các thẻ HTML về liên kết, thuộc tính này chỉ áp dụng được với các thẻ HTML về liên kết như thẻ <a>.
• Thuộc tính src là thuộc tính chứa nguồn của tài nguyên (như hình ảnh, video, âm thanh) mà bạn muốn chèn lên trang web. Chỉ có các thẻ như <img>, <audio>, <video> mới sử dụng được thuộc tính này và đồng thời cũng bắt buộc phải có thuộc tính này.

IV. HTML element

HTML element (phần tử HTML) là bao gồm tất cả những gì tử thẻ HTML mở cho tới thẻ HTML đóng. Ví dụ dưới đây là một phần tử HTML:

Đối với các thẻ HTML không có thẻ đóng, như thẻ <br>, <hr> thì chúng được coi là những phần tử rỗng.

V. Kết luận

Tóm lại thì, một tài liệu HTML được tạo nên từ nhiều phần tử HTML, mỗi phần tử HTML thì bao gồm thẻ đóng, thẻ mở, và nội dung nằm giữa chúng. Trong các thẻ mở HTML, thì có thể có các thuộc tính.

Mối quan hệ giữa các khái niệm trên bạn có thể hình dung như vậy.

HTML chỉ có một số khái niệm cơ bản như vậy thôi, cũng dễ hiểu đúng không nào. Tuy nhiên bạn vẫn cần phải nắm thật chắc những khái niệm trên nhé, bởi trong những bài viết tiếp theo mình nhắc tới rất rất nhiều.

Chúc các bạn học tập hiệu quả.

• Bài 1: Ngôn ngữ HTML là gì?
• Bài 2: Các khái niệm thường gặp trong HTML
• Bài 3: Cấu trúc trang HTML
• Bài 4: Các thẻ định dạng văn thường gặp trong HTML
• Bài 5: Chèn liên kết vào trang web với thẻ a trong HTML
• Bài 6: Chèn hình ảnh vào trang web với thẻ img trong HTML
• Bài 7: Chèn một trang web khác vào trang web của mình với thẻ iframe trong HTML
• Bài 8: Tạo bảng với HTML
• Bài 9: Tạo một danh sách với HTML
• Bài 10: Các thẻ input, thẻ tạo form nhập liệu trong HTML
• Bài 11: Kết thúc serie học HTML cơ bản

Video liên quan