Tìm hiểu về phần tử head trong HTML

Đọc thêm về phần tử head trong HTML để hiểu rõ hơn

Phần tử head trong HTML

1. Phần tử head trong HTML

- Phần tử head trong HTML là phần tử chứa siêu dữ liệu (metadata), và được đặt giữa thẻ html và thẻ body.
- Siêu dữ liệu HTML là dữ liệu về tài liệu HTML. Siêu dữ liệu không được hiển thị.

2. Tiêu đề trong HTML

- Phần tử title trong HTML dùng để xác định tiêu đề của tài liệu và là bắt buộc trong mọi tài liệu HTML.

Phần tử title trong HTML:
- Xác định tiêu đề trên tab trình duyệt.
- Cung cấp tiêu đề khi trang được thêm vào danh sách ưa thích.
- Hiển thị tiêu đề trên danh sách kết quả tìm kiếm.
Ví dụ: dưới đây là một ví dụ về tài liệu HTML:

Kết quả sau khi sử dụng phần tử title như sau:

3. Phần tử style trong HTML

Phần tử style trong HTML được dùng để chỉ định kiểu dáng cho các phần tử trên một trang HTML cụ thể.

Ví dụ: dưới đây là một minh họa về phần tử style trong HTML:

Kết quả sau khi sử dụng phần tử style như sau:

4. Phần tử link trong HTML

Phần tử link trong HTML được dùng để liên kết với các bảng điều khiển style bên ngoài.

Ví dụ: dưới đây là một minh họa về phần tử link trong HTML:

Sau khi sử dụng phần tử link, kết quả trả về như sau:

5. Phần tử meta trong HTML

Phần tử meta trong HTML dùng để chỉ định bộ ký tự, mô tả trang, từ khóa, tác giả và các siêu dữ liệu khác.

Siêu dữ liệu được sử dụng trên trình duyệt, công cụ tìm kiếm và các dịch vụ web khác.

Dưới đây là một ví dụ về phần tử meta trong HTML:

Kết quả sau khi sử dụng thẻ meta trong HTML như sau:

'Tìm hiểu về phần tử meta trong HTML.'

6. Thiết lập Viewport trong HTML

Trong HTML, đã có một phương thức mới cho phép các nhà thiết kế web kiểm soát Viewport thông qua thẻ meta.

Viewport là khu vực hiển thị nội dung của trang web trên thiết bị của người dùng và thay đổi theo kích thước màn hình.

Chúng ta có thể thêm phần tử meta viewport dưới đây vào tất cả các trang web:

Trong đó:
- Phần tử meta viewport cung cấp hướng dẫn cho trình duyệt về cách kiểm soát kích thước và tỷ lệ của trang.
- Phần width=device-width thiết lập chiều rộng của trang để phù hợp với kích thước của màn hình thiết bị (thay đổi tùy theo thiết bị).
- Phần initial-scale=1.0 thiết lập tỷ lệ phóng ban đầu khi trang được tải lần đầu tiên trên trình duyệt.
Ví dụ: dưới đây là ví dụ về một trang web không có thẻ meta viewport (bên trái) và một trang web có thẻ meta viewport (bên phải):

7. Sử dụng Phần tử script trong HTML

Phần tử script trong HTML được sử dụng để thêm mã JavaScript vào trang web.

Ví dụ: dưới đây là ví dụ về sử dụng phần tử script trong HTML. Trong ví dụ này, JavaScript sẽ thêm nội dung 'Mytour' vào phần tử HTML có id='demo':

Kết quả sau khi thêm có dạng như sau:

8. Phần tử base trong HTML

Phần tử base trong HTML được dùng để xác định URL hoặc mục tiêu mặc định cho tất cả các URL tương đối trên trang web.
Ví dụ: dưới đây là một ví dụ về sử dụng phần tử base trong HTML:

Kết quả trả về sẽ có dạng như sau:

9. Có thể bỏ qua các thẻ html, head và body?

Trong HTML5, ta có thể bỏ qua các thẻ như thẻ html, body và thẻ head.

Ví dụ: đoạn mã sau đây được coi là hợp lệ, trong đó ta bỏ qua các thẻ html, body và thẻ head:

Kết quả trả về sẽ có dạng như sau:

10. Tổng kết

Dưới đây là danh sách các phần tử head trong HTML:

Bài viết này giới thiệu về phần tử head trong HTML giúp bạn có nhiều tài liệu để học HTML tốt hơn. Bạn có thể tham khảo thêm các bài viết khác trên Mytour để tìm hiểu về danh sách trong HTML. Trong bài viết tiếp theo, Mytour sẽ giới thiệu tiếp về layout trong HTML.