HTML标记

元数据意味着关于数据的信息。这个 标签 在HTML中提供有关HTML文档的信息,或者简单地说,它提供有关文档的重要信息。在制作网页或网站时添加元标记是一种很好的做法,因为像谷歌这样的搜索引擎会搜索这个元标记,以便理解网站提供的信息。如果用户搜索特定网站,搜索引擎结果页面将在搜索结果中显示片段,提供与该网站相关的信息,这也很有用。这些标记基本上用于添加名称/值对,以描述HTML文档的属性,例如过期日期、作者姓名、关键字列表、文档作者等,即用于指定字符集、页面描述、关键字、文档作者和视口设置。这个标记是一个空元素,因为它只有一个开始标记,没有结束标记,但它在属性中携带信息。根据信息的不同,web文档可以包含一个或多个元标记,但一般来说,它不会影响文档的物理外观。

null

语法:

<meta attribute-name="value">

属性: 这个标签接受下面提到和描述的四个属性。

注: meta标记也接受 全局属性 在HTML中

要点:

  • 标记内容在浏览器上不可见,但可以被机器解析。
  • 它们只是用来提供有关HTML文档的附加信息。
  • 标记被添加到我们的HTML文档中,用于 搜索引擎优化。
  • 它们被添加到标签中,供浏览器、搜索引擎和其他web服务使用。
  • 通过 标记,设计师可以控制视口。

例子: 这个简单的例子说明了在提供信息的head标签中使用meta标签。

HTML

<!DOCTYPE html>
< html >
< head >
< meta charset = "utf-8" >
< meta name = "viewport"
content=" width = device -width,
initial-scale = 1 ,
maximum-scale = 1 ">
< meta name = "description"
content="A Computer Science portal for geeks.
It contains well written, well thought
and well explained computer science and
programming articles, quizzes and practice/competitive
programming/company interview Questions.">
< meta http-equiv = "Content-Type"
content = "text/html; charset=utf-8" />
</ head >
< body >
< h2 >GeeksforGeeks</ h2 >
< p >This is an example of meta tag</ p >
</ body >
</ html >


输出:

图片[1]-HTML标记-yiteyi-C++库

HTML 标记

实现 标记还有多种其他方法,可以使用以下属性值:

突出重要关键词: meta标记包含网页上的重要关键字,web浏览器利用这些关键字根据搜索对网页进行排序。搜索引擎优化是对内容SEO排名进行优化的另一个术语。

例子: 本例描述了带有名称和内容属性的 标记,它们的值设置为关键字和一些内容。

HTML

<!DOCTYPE html>
< html >
< head >
<!-- meta tag starts -->
< meta name = "keywords"
content = "Meta Tags, Metadata" />
<!-- meta tag ends -->
</ head >
< body >
< p >Hello GeeksforGeeks!</ p >
</ body >
</ html >


输出:

Hello GeeksforGeeks!

提供网页的描述 :元标记中可以包含网页的简短描述,这将帮助网页在internet上排名。

例子: 这个例子描述了如何使用 标签来提供网站的描述。

HTML

<!DOCTYPE html>
< html >
< head >
<!-- meta tag starts -->
< meta name = "keywords"
content = "Meta Tags, Metadata" />
< meta name = "description"
content = "Geeksforgeeks is a computer science portal." />
<!-- meta tag ends -->
</ head >
< body >
< p >GeeksforGeeks!</ p >
</ body >
</ html >


输出 :

GeeksforGeeks!

文件修订日期: meta标签用于提供有关上次更新文档的信息。刷新网页时,各种web浏览器都会使用这些信息。

例子: 本例描述了如何使用 标记来提供上次更新的文档信息。

HTML

<!DOCTYPE html>
< html >
< head >
<!-- meta tag starts -->
< meta name = "keywords" content = "Meta Tags, Metadata" />
< meta name = "description" content = "Learn about Meta Tags." />
< meta name = "revised detail" content = "last updated time" />
<!-- meta tag ends -->
</ head >
< body >
< p >GeeksforGeeks!</ p >
</ body >
</ html >


输出:

GeeksforGeeks!

自动刷新: meta标签中会提到一个指定的时间,在该时间之后网页将自动刷新,即,此meta标签用于指定一个持续时间,在该持续时间之后,网页将在给定的持续时间之后自动刷新。

例子: 下面的代码将在8秒后刷新网页。

HTML

<!DOCTYPE html>
< html >
< head >
<!-- meta tag starts -->
< meta name = "keywords about"
content = "Meta Tags, Metadata" />
< meta name = "description"
content = "Learning about Meta Tags." />
< meta name = "revised about"
content = "GeeksforGeeks" />
< meta http-equiv = "refresh"
content = "8" />
<!-- meta tag ends -->
</ head >
< body >
< p >GeeksforGeeks!</ p >
</ body >
</ html >


输出:

图片[2]-HTML标记-yiteyi-C++库

将标签属性值设置为在指定的持续时间内自动刷新网页

指定网页作者: MetaTag允许我们提及网页作者的姓名,如下所示。

例子: 本例描述了如何使用 标记来提供作者的详细信息。

HTML

<!DOCTYPE html>
< html >
< head >
<!-- meta tag starts -->
< meta name = "keywords used "
content = "Meta Tags, Metadata" />
< meta name = "description about"
content = "Meta tags learning." />
< meta name = "author"
content = "Akash Kumar17" />
<!-- meta tag ends -->
</ head >
< body >
< p >GeeksforGeeks!</ p >
</ body >
</ html >


输出:

GeeksforGeeks!

浏览器支持:

  • 谷歌Chrome93.0
  • Internet Explorer 11.0
  • 微软Edge 93.0
  • Mozilla 92.0
  • 歌剧78.0
  • 狩猎14.1
© 版权声明
THE END
喜欢就支持一下吧
点赞15 分享