Thẻ <meta> HTML
Ví dụ
Mô tả siêu dữ liệu trong tài liệu HTML:
<head>
<meta charset="UTF-8">
<meta name="description" content="Free Web tutorials">
<meta name="keywords" content="HTML, CSS, JavaScript">
<meta name="author" content="John Doe">
<meta
name="viewport" content="width=device-width, initial-scale=1.0">
</head>
Hãy tự mình thử »Thêm ví dụ "Hãy tự mình thử" bên dưới.
Định nghĩa và cách sử dụng
Thẻ <meta>
xác định siêu dữ liệu về tài liệu HTML. Siêu dữ liệu là dữ liệu (thông tin) về dữ liệu.
Thẻ <meta>
luôn nằm bên trong phần tử <head> và thường được sử dụng để chỉ định bộ ký tự, mô tả trang, từ khóa, tác giả của tài liệu và cài đặt chế độ xem.
Siêu dữ liệu sẽ không được hiển thị trên trang nhưng có thể phân tích cú pháp bằng máy.
Siêu dữ liệu được sử dụng bởi trình duyệt (cách hiển thị nội dung hoặc tải lại trang), công cụ tìm kiếm (từ khóa) và các dịch vụ web khác.
Có một phương pháp cho phép các nhà thiết kế web kiểm soát chế độ xem (khu vực hiển thị của người dùng trên trang web), thông qua thẻ <meta>
(Xem ví dụ "Cài đặt chế độ xem" bên dưới).
Hỗ trợ trình duyệt
Element | |||||
---|---|---|---|---|---|
<meta> | Yes | Yes | Yes | Yes | Yes |
Thuộc tính
Attribute | Value | Description |
---|---|---|
charset | character_set | Specifies the character encoding for the HTML document |
content | text | Specifies the value associated with the http-equiv or name attribute |
http-equiv | content-security-policy content-type default-style refresh |
Provides an HTTP header for the information/value of the content attribute |
name | application-name author description generator keywords viewport |
Specifies a name for the metadata |
Thuộc tính chung
Thẻ <meta>
cũng hỗ trợ Thuộc tính chung trong HTML .
Thêm ví dụ
Xác định từ khóa cho công cụ tìm kiếm:
<meta name="keywords" content="HTML, CSS, JavaScript">
Xác định mô tả trang web của bạn:
<meta name="description" content="Free Web tutorials for
HTML and CSS">
Xác định tác giả của một trang:
<meta name="author" content="John Doe">
Làm mới tài liệu sau mỗi 30 giây:
<meta http-equiv="refresh" content="30">
Đặt chế độ xem để làm cho trang web của bạn trông đẹp trên tất cả các thiết bị:
<meta name="viewport" content="width=device-width, initial-scale=1.0">
Đặt chế độ xem
Chế độ xem là khu vực hiển thị của người dùng trên trang web. Nó thay đổi tùy theo thiết bị - nó sẽ nhỏ hơn trên điện thoại di động so với trên màn hình máy tính.
Bạn nên bao gồm phần tử <meta>
sau trong tất cả các trang web của mình:
<meta name="viewport" content="width=device-width, initial-scale=1.0">
Điều này 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
đặt chiều rộng của trang theo chiều rộng màn hình của thiết bị (sẽ thay đổi tùy theo thiết bị).
Phần initial-scale=1.0
đặt mức thu phóng ban đầu khi trang được trình duyệt tải lần đầu tiên.
Dưới đây là ví dụ về một trang web không có thẻ meta khung nhìn và cùng một trang web có thẻ meta khung nhìn:
Mẹo: Nếu bạn đang duyệt trang này bằng điện thoại hoặc máy tính bảng, bạn có thể nhấp vào hai liên kết bên dưới để thấy sự khác biệt.
Bạn có thể đọc thêm về chế độ xem trong Thiết kế web đáp ứng của chúng tôi - Hướng dẫn về chế độ xem .
Trang liên quan
Hướng dẫn HTML: Đầu HTML
Tham chiếu DOM HTML: Meta Object
Cài đặt CSS mặc định
Không có.