电脑技巧.图片新闻 | 用户注册 | 用户中心 | 发表文章 | 留言簿 | 扫一扫手机阅读
  |繁体中文|  RSS订阅 |极速版  |手机访问  
电脑常用技巧,PC Skill,电脑知识,组装维修,经验,资料精华宝库,HUGESKY CMS官网,鸿天全站,HUGESKY-meta标签的各种使用技巧
本站申明:
本站尽量纯净无广告,提供交流学习类共享资料。[广告投放说明] [联系]
  • 首 页
  • 电脑知识
  • 应用技巧
  • 组装技巧
  • 维修技巧
  • 网络技巧
  • 组网通信
  • 办公技巧
  • 技巧视频
  • 编程技巧
  • 防毒技巧
  • 博客圈
会员注册关闭
帐号: 密码: 验证码: 点击显示验证码 记住
电脑技巧 -> 编程技巧 -> JAVA编程技巧

meta标签的各种使用技巧

作者:未知来源:网络收集 整理日期:2019-08-04
推荐指数: 点击:718   文字大小: 加入收藏夹


一、http-equiv

1.Content-Type(内容类型)

告诉浏览器当前访问的资源类型 并声明编码

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
2.refresh(重定向)

重定向(以下示例5秒后会跳转到:http://baidu.com)

<meta http-equiv="refresh" content="5;url="http://baidu.com" />
3.Set-Cookie(cookie设定)

网页过期则cookie将会被删除(必须是GMT的时间格式)

<meta http-equiv="Set-Cookie" content="cookievalue=xxx;expires=Wednesday,21-Oct-98 16:14:21 GMT;path=/">
4.WINdow-target(窗口设置)

强制页面在当前窗口以独立页面显示----用来防止别人在框架里面调用你的页面

<meta http-equiv="Window-target" content="_top">
5.expires(期限)

用于设定网页的到期时间,一旦网页过期,必须到服务器上重新调阅(必须使用GMT的时间格式)

<meta http-equiv="expires" content="Wed, 26 Feb 2016 08:21:57GMT">
6.Pragma(cache模式)

禁止浏览器从本地机的缓存中调阅页面内容(访问者无法脱机浏览)

<meta http-equiv="Pragma" content="no-cache">

二、name

1.keywords

页面的关键字,是写给搜索引擎看的,关键字可以有多个用 ‘,’号隔开

<meta name="keywords" content="HTML,CSS,JAVASCRIPT,PHP">
2.description

页面的描述,是写给搜索引擎看的,关键字可以有多个用 ‘,’号隔开

<meta name="description" content="html meta标签大全,整理一下加强记忆">
3.robots(机器人向导)

robots用来告诉搜索机器人,哪些页面需要索引,哪些不需要。
用来阻止搜索引擎获取拷贝页面、私密页面和未完成的页面。

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

content:
  all:默认值,文件将被检索,且页面上的链接可以被查询;
  none:文件将不被检索,且页面上的链接不可以被查询;
  index:文件将被检索;
  follow:页面上的链接可以被查询;
  noindex:文件将不被检索;
  nofollow:页面上的链接不可以被查询。

4.author(作者)

标注网页的作者

<meta name="author" content="johnson">

content:

自定义:自定义的作者名;
  notranslate:让Google不提供一个翻译链接;

4.viewport(视口)

针对移动端视口进行宽高和缩放的设置

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

content:
  width 宽度(数值/device-width)
  height 高度(数值/device-height)
  initial-scale 初始缩放比例
  maximum-scale 最大缩放比例
  minimum-scale 最小缩放比例
  user-scalable 是否允许用户缩放(yes/no)

<blockquote>
PS:部分老浏览器不支持 viewport,使用如下 meta 对其进行设备优化
</blockquote>

<meta name="HandheldFriendly" content="true">
5.format-detection(禁止默认)

禁止将文本提示为手机号、邮箱、地图链接,否则点击文本将触发默认事件

<meta name="format-detection" content="telephone=no">
<meta name="format-detection" content="email=no">
<meta name="format-detection" content="adress=no">

content:
  telephone=no 禁止将文本提示为手机号码
  email=no 禁止将文本提示为邮箱地址
  adress=no 禁止将文本提示为地图链接

6.msapplication-tap-highlight(禁止链接高亮)

禁止链接高亮

<meta name="msapplication-tap-highlight" content="no">

content:
  (yes | no)

7.apple-mobile-web-app-title(添加到主屏后的标题)

添加到主屏后的标题

<meta name="apple-mobile-web-app-title" content="标题" />

content:
  自定义标题

8.工具栏设置

设置工具栏的颜色、透明度

<meta name="apple-mobile-web-app-capable" content="yes" /> // webapp全屏模式
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" /> // 在 apple-mobile-web-app-capable 为 yes 的前提下进行设置

apple-mobile-web-app-status-bar-style
content:
  default 默认值,网页内容从状态栏底部开始
  black 状态栏背景是黑色,网页内容从状态栏底部开始
  black-translucent 状态栏背景是黑色半透明,网页内容充满整个屏幕,顶部会被状态栏遮挡

9.UC浏览器设置

uc强制竖屏

<meta name="screen-orientation" content="portrait">

UC缩放不出滚动条

<meta name="viewport" content="uc-fitscreen=no|yes"/>

UC强制全屏

<meta name="full-screen" content="yes">

UC强制图片显示:UC浏览器为了节省流量,为用户提供了无图模式,但是如果页面的图片是必不可少的,如验证码的,需要强制浏览器显示图片,可以设置imagemode, 不影响子页面。

<meta name="imagemode" content="force"/> // 对该页面全部图片设置
<img src="" show="force"> // 对单个图片的设置

UC应用模式:默认全屏,禁止长按菜单,禁止收拾,标准排版,以及强制图片显示。

<meta name="browsermode" content="application"/>
10.QQ浏览器设置

QQ强制屏幕方向:portrait 竖屏,landscape 横屏

<meta name="x5-orientation" content="portrait|landscape" />

QQ强制全屏

<meta name="x5-fullscreen" content="true" />

QQ应用模式

<meta name="x5-page-mode" content="app" />

三、PC端常用

<!-- 使用 IE 标准模式渲染 -->
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<!-- 强制 IE 使用 Chrome Frame 渲染 -->
<meta http-equiv="X-UA-Compatible" content="chrome=1">
<!-- 360 浏览器 -->
<meta name="renderer" content="webkit"> // 默认webkit内核
<meta name="renderer" content="ie-comp"> // 默认IE兼容模式
<meta name="renderer" content="ie-stand"> // 默认IE标准模式

四、移动端常用

<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1.0, minimum-scale=1.0,user-scalable=no" />
<meta name="format-detection" content="telephone=no">
<meta name="format-detection" content="email=no">
<meta name="format-detection" content="adress=no">
<meta name="screen-orientation" content="portrait">
<meta name="x5-fullscreen" content="true" />

 
获得更多 -> 编程技巧 -> JAVA编程技巧
技术支持

责任编辑: webmaster >>> 百度上搜索  谷歌上搜索

hugesky
点击复制本连接 (http://www.hugesky.com/showarticle.php?id=6825)

发送到邮件  转换为打印版本  投 发表文章  报 侵权报告  关 关闭窗口
 html meta标签‘http-equiv’与‘name’属性的详解用法
 meta标签使用中文注释详解

>>> 相关资讯:

  • . 根据域名判断广告轮流显示
  • . 仿百度搜索框输入效果
  • . Java性能优化技巧集锦三
  • . 最佳免费文件管理软件NexusFile多国语
  • . js里判断输入的密码不能单为数字
  • . iframe去边框无边框使用技巧大全
  • . meta标签使用中文注释详解
  • . javascript取得浏览器地址及参数方法
  • . Url相对路径和绝对路径的问题总结
  • . SQL函数汇总精选
【声明】:
以上文章或资料除注明为电脑技巧原创或编辑整理外,均为网络收集整理或网友推荐。以上内容以共享、参考、研究为目的,不存在任何商业目的。
未注明作者或出处的文章,可能资料来源不规范。如有涉及版权请给予及时联系更正或予以删除。
评论:(开放)

  网友评论: 评  
以下网友评论只代表网友个人观点,不代表本站观点
  发表评论:(匿名用户不能发表评论! 注册 登陆)
昵称: 验证码:
评分:
5 4 3 2 1
内容:
  请文明参与讨论,禁止漫骂攻击。
 
·用户发表意见仅代表其个人意见,并且承担一切因发表内容引起的纠纷和责任.
·本站管理人员有权在不通知用户的情况下删除不符合规定的评论信息或留做证据.
·请客观的评价您所看到的资讯,提倡就事论事,杜绝漫骂和人身攻击等不文明行为.
内容搜索
    • 站内搜索
热门资讯
  • 电脑快捷键全都在这了!电脑技巧...
  • 图说最常用的10个电脑技巧
  • 别说你不会?这9个电脑技巧你必须...
  • Win7解决C盘占用空间大的方法
  • 网银密码设置小技巧
  • win7安装AHCI驱动
  • 平板电脑选购六大要点
  • [推荐]五步搞定电脑网络安全 五步...
  • 系统自带的最不起眼但又是最强的...
  • 上班族必懂的电脑技能技巧
推荐信息
开启模板:NEWSKY -关于版权 - 隐私保护 - 联系我们 - 网站地图 - 会员列表 - 加入收藏 - 返回顶部

我问佛:如何才能如你般睿智? 佛曰:佛是过来人,人是未来佛。
部分资源收集于互联网并遵循 署名-非商业性使用-相同方式共享3.0共享,尽量署名原创。
据《信息网络传播权保护条例》 如侵犯您的权利,请联系webmaster(at)hugesky.com删除。
Power By HugeSky.Com

Copyright© www.hugesky.com
Powered by HUGESKY CMS 7.1.1.1080918 professional licensed