HTML meta标签

最新推荐文章于 2022-05-20 18:13:31 发布

niuniu924

最新推荐文章于 2022-05-20 18:13:31 发布

阅读量224

点赞数

分类专栏：前端

本文链接：https://blog.csdn.net/niuniu924/article/details/103570850

版权

前端专栏收录该内容

5 篇文章 0 订阅

订阅专栏

w3c标准：

所谓的名称/值其实就是：http-equiv/content name/content

常用的名称/值：

1. http-equiv/content

1.<meta http-equiv=”Set-Cookie” content=”cookievalue=xxx; expires=Friday,12-Jan-2001 18:18:18 GMT; path=/”>:如果网页过期，那么存盘的cookie将被删除。必须使用GMT的时间格式。
2.<meta http-equiv='expires' content='时间' >：用于设定网页的到期时间。一旦网页过期，必须到服务器上重新传输。
3.<meta http-equiv=”Refresh” content=”5;URL”>：告诉浏览器在【数字】秒后跳转到【一个网址】
4.<meta http-equiv=”content-Type” content=”text/html; charset=utf-8″>：设定页面使用的字符集。
  <meta charset=”utf-8″>：在HTML5中设定字符集的简写写法。
5.<meta http-equiv=”Pragma” content=”no-cache”>：禁止浏览器从本地计算机的缓存中访问页面内容。访问者将无法脱机浏览。
6.<meta http-equiv=”Window-target” content=”_top”>：用来防止别人在iframe(框架)里调用自己的页面，这也算是一个非常实用的属性。
7.<meta http-equiv='X-UA-Compatible' content='IE=edge,chrome=1'> :强制浏览器按照特定的版本标准进行渲染。但不支持IE7及以下版本。如果是ie浏览器就用最新的ie渲染，如果是双核浏览器就用chrome内核。
8.<meta http-equiv="Pragma" content="no-cache"/>：禁止浏览器从本地计算机的缓存中访问页面内容。
9.<meta http-equiv="Window-target" content="_top"/>：强制页面在当前窗口以独立页面显示，可以用来防止别人在框架里调用你的页面。
10.<meta http-equiv="Content-Language" content="zh-cn"/>：显示语言
11.<meta name="format-detection" content="telphone=no, email=no"/>：忽略电话号码和邮箱

2. name/content

1.<meta name=”viewport” content=”width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no”>：在移动设备浏览器上，禁用缩放（zooming）功能，用户只能滚动屏幕。
  参数值：
  width viewport的宽度[device-width | pixel_value]width如果直接设置pixel_value数值，大部分 
  的安卓手机不支持，但是ios支持；   
  height – viewport 的高度 （范围从 223 到 10,000 ）   
  user-scalable [yes | no]是否允许缩放   
  initial-scale [数值] 初始化比例（范围从 > 0 到 10）   
  minimum-scale [数值] 允许缩放的最小比例   
  maximum-scale [数值] 允许缩放的最大比例 
2.<meta name=”description” content=””>：告诉搜索引擎，当前页面的主要内容是xxx。
3.<meta name=”keywords” content=””>：告诉搜索引擎，当前页面的关键字。
4.<meta name=”author” content=””>：告诉搜索引擎，标注网站作者是谁。
5.<meta name=”copyright” content=””>：标注网站的版权信息。
6.<meta name="generator" content="你所用的编辑器"/>：说明网站采用什么编辑器制作。
7.<meta name="robots" content=""/>：告诉搜索机器人哪些页面需要索引，哪些页面不需要索引。
  content的参数值有all,none,index,noindex,follow,nofollow，默认值是all。
  参数为 all ：文件将被检索，且页面上的链接可以被查询； 参数为 none ：文件将不被检索，且页面上的 
  链接不可以被查询； 参数为 index ：文件将被检索； 参数为 follow ：页面上的链接可以被查询； 参数 
  为 noindex ：文件将不被检索，但页面上的链接可以被查询； 参数为 nofollow ：文件将被检索，但页面 
  上的链接不可以被查询；
8.<meta name="revisit-after" content="7days"/>：网站重访，通知搜索引擎多少天访问一次
9.<meta name="renderer" content="webkit|ie-comp|ie-stand">
  若页面需默认用极速核，增加标签：<meta name="renderer" content="webkit">
  若页面需默认用ie兼容内核，增加标签：<meta name="renderer" content="ie-comp">
  若页面需默认用ie标准内核，增加标签：<meta name="renderer" content="ie-stand">
10.<meta name="revised" content="最后修改时间"/>：除了添加最后修改时间外，可以带上修改人名字或昵称，也可以是某个机构或组织等单位！
  用法举例：
  如果是刘代码最后修改该网页的时间是2019年10月1日，就可以这样写：
  <meta name="revised" content="刘代码, 2019年10月1日"/>
  如果是百度前端开发团队，在2019年10月1日，可以这样写：
  <meta name="revised" content="百度Web前端开发团队, 2019/10/1"/>

补充：

WebApp全屏模式

隐藏状态栏/设置状态栏颜色：只有在开启WebApp全屏模式时才生效。content的值为default | black | black-translucent 。

不同浏览器

转码申明：用百度打开网页可能会对其进行转码（比如贴广告），避免转码可添加如下meta

参考链接：

https://www.jianshu.com/p/179ddc16ef55

https://blog.csdn.net/zhangank/article/details/94014629

https://www.douban.com/group/topic/157006620/

niuniu924

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
HTML meta标签

w3c标准：<meta> 元素可提供有关页面的元信息（meta-information），比如针对搜索引擎和更新频度的描述和关键词。<meta> 标签位于文档的头部，不包含任何内容。<meta> 标签的属性定义了与文档相关联的名称/值对。<meta>标签拥有四个属性：content http-equiv name scheme，其中sch...
复制链接

扫一扫

专栏目录