描述 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>
亲自试一试 »
下面有更多 "亲自试一试" 示例。
这个<meta>
标签定义有关 HTML 文档的元数据。元数据是关于数据的数据(信息)。
<meta>
标签始终位于 <head> 元素内部,通常用于指定字符集、页面描述、关键字、文档作者和视口设置。
元数据不会显示在页面上,但可以由机器解析。
元数据由浏览器(如何显示内容或重新加载页面)、搜索引擎(关键字)和其他 Web 服务使用。
有一种方法可以让网页设计者通过以下方式控制视口(网页的用户可见区域)<meta>
标签(参见下面的 "Setting The Viewport" 示例)。
Element | |||||
---|---|---|---|---|---|
<meta> | Yes | Yes | Yes | Yes | Yes |
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 |
这个<meta>
标签还支持HTML 中的全局属性。
定义搜索引擎的关键字:
<meta name="keywords" content="HTML, CSS, JavaScript">
定义网页的描述:
<meta name="description" content="Free Web tutorials for HTML and CSS">
定义页面的作者:
<meta name="author" content="John Doe">
每 30 秒刷新一次文档:
<meta http-equiv="refresh" content="30">
设置视口以使您的网站在所有设备上看起来都不错:
<meta name="viewport" content="width=device-width, initial-scale=1.0">
视口是网页的用户可见区域。它因设备而异 - 在手机上它会比在电脑屏幕上小。
您应该包括以下内容<meta>
所有网页中的元素:
<meta name="viewport" content="width=device-width, initial-scale=1.0">
这为浏览器提供了如何控制页面尺寸和缩放的说明。
这个width=device-width
部分设置页面的宽度以遵循设备的屏幕宽度(这将根据设备而变化)。
这个initial-scale=1.0
部分设置浏览器首次加载页面时的初始缩放级别。
这是一个网页示例没有视口元标记和相同的网页和视口元标记:
提示:如果您使用手机或平板电脑浏览此页面,可以点击下面的两个链接查看区别。
您可以在我们的中阅读有关视口的更多信息响应式网页设计 - 视口教程。
HTML 教程:HTML 头
HTML DOM 参考:元对象
没有任何。
截取页面反馈部分,让我们更快修复内容!也可以直接跳过填写反馈内容!