无涯教程网

关注我们

HTML - Meta标签

HTML - Meta标签

HTML使您可以指定元数据Metadata-以各种方式有关文档的其他重要信息。 META元素可用于包含描述HTML文档属性的名称/值对，例如作者，有效期，关键字列表，文档作者等。

添加元标签

您可以通过将<meta>标签放在由<head>和</head>标签表示的文档标题内，将元数据添加到网页，除了核心属性外，元标签还可以具有以下属性-

Sr.No	Attribute & Remark
1	Name 属性的名称，示例包括 keywords， description， author， revised， generator etc.
2	content 指定属性的值。
3	scheme 指定一种解释属性值的方案(如content属性中所声明)。
4	http-equiv 用于http响应消息头。例如，http-equiv可用于刷新页面或设置cookie。

Keywords 关键字

您可以使用<meta>标签来指定与文档相关的重要关键字，以后这些关键字将被搜索引擎在为您的网页创建索引以供搜索时使用。

下面是一个示例，其中无涯教程添加HTML，元标签，元数据作为有关文档的重要关键字。

<!DOCTYPE html>
<html>
   
   <head>
      <title>Meta Tags Example</title>
      <meta name="keywords" content="HTML, Meta Tags, Metadata" />
   </head>
   
   <body>
      <p>Hello HTML5!</p>
   </body>
   
</html>

这将产生以下输出-

Description 关键字

您可以使用<meta>标签对文档进行简短描述。在为您的网页创建索引以供搜索时，各种搜索引擎也可以使用此函数。

<!DOCTYPE html>
<html>

   <head>
      <title>Meta Tags Example</title>
      <meta name="keywords" content="HTML, Meta Tags, Metadata" />
      <meta name="description" content="Learning about Meta Tags." />
   </head>
	
   <body>
      <p>Hello HTML5!</p>
   </body>
   
</html>

Revision 时间

您可以使用<meta>标签提供有关上次文档更新时间的信息。刷新网页时，各种Web浏览器都可以使用此信息。

<!DOCTYPE html>
<html>

   <head>
      <title>Meta Tags Example</title>
      <meta name="keywords" content="HTML, Meta Tags, Metadata" />
      <meta name="description" content="Learning about Meta Tags." />
      <meta name="revised" content="Learnfk, 3/7/2014" />
   </head>
	
   <body>
      <p>Hello HTML5!</p>
   </body>
	
</html>

Refreshing 刷新

<meta>标签可用于指定持续时间，在该持续时间之后您的网页将保持自动刷新。

如果您希望页面每5秒刷新一次，请使用以下语法。

<!DOCTYPE html>
<html>

   <head>
      <title>Meta Tags Example</title>
      <meta name="keywords" content="HTML, Meta Tags, Metadata" />
      <meta name="description" content="Learning about Meta Tags." />
      <meta name="revised" content="Learnfk, 3/7/2014" />
      <meta http-equiv="refresh" content="5" />
   </head>
	
   <body>
      <p>Hello HTML5!</p>
   </body>
	
</html>

Page 重定向

您可以使用<meta>标签将页面重定向到任何其他网页。如果要在一定秒数后重定向页面，也可以指定持续时间。

以下是5秒钟后将当前页面重定向到另一个页面的示例。

<!DOCTYPE html>
<html>

   <head>
      <title>Meta Tags 例</title>
      <meta name="keywords" content="HTML, Meta Tags, Metadata" />
      <meta name="description" content="Learning about Meta Tags." />
      <meta name="revised" content="Learnfk, 3/7/2014" />
      <meta http-equiv="refresh" content="5; url=http://www.learnfk.com" />
   </head>
	
   <body>
      <p>Hello HTML5!</p>
   </body>
	
</html>

Cookies 设置

Cookies是数据，存储在您计算机上的小文本文件中，并且在Web浏览器和Web服务器之间进行交换，以根据您的Web应用程序需求跟踪各种信息。

您可以使用<meta>标签在客户端存储cookie，以后，Web服务器可以使用此信息来跟踪站点访问者。

<!DOCTYPE html>
<html>

   <head>
      <title>Meta Tags Example</title>
      <meta name="keywords" content="HTML, Meta Tags, Metadata" />
      <meta name="description" content="Learning about Meta Tags." />
      <meta name="revised" content="Learnfk, 3/7/2014" />
      <meta http-equiv="cookie" content="userid=xyz;
         expires=Wednesday, 08-Aug-15 23:59:59 GMT;" />
         
   </head>
	
   <body>
      <p>Hello HTML5!</p>
   </body>
	
</html>

如果不包括到期日期和时间，则该cookie被视为会话cookie，并且在用户退出浏览器时将被删除。

链接：https://www.learnfk.comhttps://www.learnfk.com/html/html-meta-tags.html

来源：LearnFk无涯教程网

Author 作者名称

您可以使用meta标签在网页中设置作者姓名。请参阅下面的示例-

<!DOCTYPE html>
<html>

   <head>
      <title>Meta Tags Example</title>
      <meta name="keywords" content="HTML, Meta Tags, Metadata" />
      <meta name="description" content="Learning about Meta Tags." />
      <meta name="author" content="Mahnaz Learnfk" />
   </head>
	
   <body>
      <p>Hello HTML5!</p>
   </body>
	
</html>

Character 字符编码

您可以使用<meta>标签来指定网页中使用的字符集。

默认情况下，Web服务器和Web浏览器使用ISO-8859-1(Latin1)编码来处理Web页面。以下是设置UTF-8编码的示例-

<!DOCTYPE html>
<html>

   <head>
      <title>Meta Tags Example</title>
      <meta name="keywords" content="HTML, Meta Tags, Metadata" />
      <meta name="description" content="Learning about Meta Tags." />
      <meta name="author" content="Mahnaz Learnfk" />
      <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
   </head>
	
   <body>
      <p>Hello HTML5!</p>
   </body>
	
</html>

要使用繁体中文字符为静态页面提供服务，该网页必须包含<meta>标签以设置Big5编码-

<!DOCTYPE html>
<html>

   <head>
      <title>Meta Tags Example</title>
      <meta name="keywords" content="HTML, Meta Tags, Metadata" />
      <meta name="description" content="Learning about Meta Tags." />
      <meta name="author" content="Mahnaz Learnfk" />
      <meta http-equiv="Content-Type" content="text/html; charset=Big5" />
   </head>
	
   <body>
      <p>Hello HTML5!</p>
   </body>
	
</html>

祝学习愉快！(内容编辑有误？请选中要编辑内容 -> 右键 -> 修改 -> 提交！)

技术教程推荐

朱赟的技术管理课 -〔朱赟〕

快速上手Kotlin开发 -〔张涛〕

网络编程实战 -〔盛延敏〕

MongoDB高手课 -〔唐建法（TJ）〕

编译原理实战课 -〔宫文学〕

如何看懂一幅画 -〔罗桂霞〕

郭东白的架构课 -〔郭东白〕

Spring Cloud 微服务项目实战 -〔姚秋辰（姚半仙）〕

零基础GPT应用入门课 -〔林健（键盘）〕

好记忆不如烂笔头。留下您的足迹吧 :)