html怎样添加meta标签

html怎样添加meta标签,第1张

HTML <meta>标签

定义和用法

<meta>元素可提供有关页面的元信息(meta-information),比如针对搜索引擎和更新频度的描述和关键词。

<meta>标签位于文档的头部,不包含任何内容。<meta>标签的属性定义了与文档相关联的名称/值对。

HTML 与 XHTML 之间的差异

在 HTML 中,<meta>标签没有结束标签。

在 XHTML 中,<meta>标签必须被正确地关闭。

提示和注释:

注释:<meta>标签永远位于 head 元素内部。

注释:元数据总是以名称/值的形式被成对传递的。

必需的属性

DTD 指示此属性允许在哪种 DTD 中使用。S=Strict, T=Transitional, F=Frameset.

属性 值 描述 DTD

content some_text 定义与 http-equiv 或 name 属性相关的元信息 STF

可选的属性

DTD 指示此属性允许在哪种 DTD 中使用。S=Strict, T=Transitional, F=Frameset.

meta标签共有两个属性,分别是http-equiv属性和name属性。

1. name属性

name属性主要用于描述网页,比如网页的关键词,叙述等。与之对应的属性值为content,content中的内容是对name填入类型的具体描述,便于搜索引擎抓取。meta标签中name属性语法格式是:

<meta name="参数" content="具体的描述">。

其中name属性共有以下几种参数。(A-C为常用属性)

A. keywords(关键字)

说明:用于告诉搜索引擎,你网页的关键字。举例:

<meta name="keywords" content="Lxxyx,博客,文科生,前端">

B. description(网站内容的描述)

说明:用于告诉搜索引擎,你网站的主要内容。举例:

<meta name="description" content="文科生,热爱前端与编程。目前大二,这是我的前端博客">

C. viewport(移动端的窗口)

说明:这个概念较为复杂,具体的会在下篇博文中讲述。这个属性常用于设计移动端网页。在用bootstrap,AmazeUI等框架时候都有用过viewport。

举例(常用范例):

<meta name="viewport" content="width=device-width, initial-scale=1">

D. robots(定义搜索引擎爬虫的索引方式)

说明:robots用来告诉爬虫哪些页面需要索引,哪些页面不需要索引。content的参数有all,none,index,noindex,follow,nofollow。默认是all。

举例:

<meta name="robots" content="none">

具体参数如下:

1.none : 搜索引擎将忽略此网页,等价于noindex,nofollow。

2.noindex : 搜索引擎不索引此网页。

3.nofollow: 搜索引擎不继续通过此网页的链接索引搜索其它的网页。

4.all : 搜索引擎将索引此网页与继续通过此网页的链接索引,等价于index,follow。

5.index : 搜索引擎索引此网页。

6.follow : 搜索引擎继续通过此网页的链接索引搜索其它的网页。

E. author(作者)

说明:用于标注网页作者举例:

<meta name="author" content="Lxxyx,[email protected]">

F. generator(网页制作软件)

说明:用于标明网页是什么软件做的举例: (不知道能不能这样写):

<meta name="generator" content="Sublime Text3">

G. copyright(版权)

说明:用于标注版权信息举例:

<meta name="copyright" content="Lxxyx">//代表该网站为Lxxyx个人版权所有。

H. revisit-after(搜索引擎爬虫重访时间)

说明:如果页面不是经常更新,为了减轻搜索引擎爬虫对服务器带来的压力,可以设置一个爬虫的重访时间。如果重访时间过短,爬虫将按它们定义的默认时间来访问。举例:

<meta name="revisit-after" content="7 days" >

I. renderer(双核浏览器渲染方式)

说明:renderer是为双核浏览器准备的,用于指定双核浏览器默认以何种方式渲染页面。比如说360浏览器。举例:

<meta name="renderer" content="webkit">//默认webkit内核

<meta name="renderer" content="ie-comp">//默认IE兼容模式

<meta name="renderer" content="ie-stand">//默认IE标准模式


欢迎分享,转载请注明来源:内存溢出

原文地址: https://outofmemory.cn/bake/11620659.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-17
下一篇 2023-05-17

发表评论

登录后才能评论

评论列表(0条)

保存