HTML (Hypertext Markup Language) là ngôn ngữ đánh dấu được sử dụng để tạo ra các trang web. HTML sử dụng các thẻ (tag) để cấu trúc và định dạng nội dung trên trang web. Mỗi thẻ có một chức năng riêng biệt và đóng vai trò quan trọng trong việc hiển thị nội dung. Dưới đây là một số loại thẻ HTML cơ bản và thường được sử dụng:
1. Thẻ Cấu Trúc
- <html>: Thẻ gốc bao bọc toàn bộ nội dung trang web. Mọi thẻ HTML khác đều nằm bên trong thẻ này.
- <head>: Chứa thông tin về trang web như tiêu đề, liên kết đến các tệp CSS, JavaScript, và metadata.
- <title>: Đặt tiêu đề cho trang web, hiển thị trên thanh tiêu đề của trình duyệt.
- <body>: Chứa tất cả nội dung hiển thị trên trang web như văn bản, hình ảnh, liên kết, v.v.
2. Thẻ Đầu Đề
- <h1> đến <h6>: Các thẻ tiêu đề, từ lớn nhất (<h1>) đến nhỏ nhất (<h6>). Thường dùng để đánh dấu các phần tiêu đề trong nội dung.
3. Thẻ Đoạn Văn Bản
- <p>: Được sử dụng để tạo các đoạn văn bản.
- <br>: Tạo ngắt dòng.
- <hr>: Tạo đường kẻ ngang, ngắt đoạn nội dung.
4. Thẻ Định Dạng Văn Bản
- <b>: Làm đậm văn bản.
- <i>: Làm nghiêng văn bản.
- <u>: Gạch chân văn bản.
- <strong>: Nhấn mạnh văn bản, thường hiển thị đậm.
- <em>: Nhấn mạnh văn bản, thường hiển thị nghiêng.
5. Thẻ Danh Sách
- <ul>: Tạo danh sách không có thứ tự (danh sách dạng điểm).
- <ol>: Tạo danh sách có thứ tự (danh sách đánh số).
- <li>: Mục của danh sách.
6. Thẻ Liên Kết và Ảnh
- <a>: Tạo liên kết đến trang web khác hoặc một phần khác trong cùng trang web.
- <img>: Chèn hình ảnh vào trang web.
7. Thẻ Bảng
- <table>: Tạo bảng.
- <tr>: Tạo hàng trong bảng.
- <td>: Tạo ô dữ liệu trong bảng.
- <th>: Tạo ô tiêu đề trong bảng, thường hiển thị đậm và căn giữa.
8. Thẻ Form
- <form>: Tạo biểu mẫu để người dùng nhập liệu và gửi dữ liệu.
- <input>: Tạo các điều khiển nhập liệu (như ô văn bản, nút gửi).
- <label>: Gắn nhãn cho các điều khiển nhập liệu.
- <button>: Tạo nút bấm.
9. Thẻ Metadata
- <meta>: Chứa thông tin metadata về trang web như mô tả, từ khóa, tác giả.
10. Thẻ Media
- <audio>: Chèn âm thanh vào trang web.
- <video>: Chèn video vào trang web.
11. Các kiểu thẻ tag:
kiểu none: Kiểu này không hiển thị nội dung; ví dụ tag meta,head,body….
Kiểu inline: Kiểu này hiển thị nội dung và chiều ngang phụ thuộc vào đối tượng bên trong là trên một hàng; ví dụ tag div, tag p
Kiểu block: Kiểu inline: Kiểu này hiển thị nội dung và chiều ngang tràn trên trình duyệt; ví dụ tag a;tag span.
12. Chuyển tag block sang kiểu inline:
sử dụng css: float:left; ví dụ <div id=”vidu1″ style=”float:left;”>Hello</div>
12. Chuyển tag kiểu inline sang block:
sử dụng css: display:block; ví dụ: <p id=”vidu2″ style=”display:block;”>Hello</p>
Việc hiểu và sử dụng đúng các thẻ HTML sẽ giúp bạn xây dựng trang web một cách hiệu quả và dễ dàng hơn. Mỗi thẻ đều có vai trò và ý nghĩa riêng, đóng góp vào việc tạo nên một trang web hoàn chỉnh và thân thiện với người dùng.