h5 meta学习
定义针对搜索引擎的关键词:<meta name="keywords" content="meta,red" />
定义对页面的描述:<meta name="description" content="这是meta教程" />
定义页面的最新版本:<meta name="revised" content="bu, 2016/5/10/" />
每 5 秒刷新一次页面:<meta http-equiv="refresh" content="5" />
网页作者: <meta name="author" content="name, email@gmail.com"/>
添加智能 App 广告条(iOS 6+ Safari):<meta name="apple-itunes-app" content="app-id=myAppStoreID, affiliate-data=myAffiliateData, app-argument=myURL">
设置苹果工具栏颜色:<meta name="apple-mobile-web-app-status-bar-style" content="black"/>
忽略页面中的数字识别为电话,忽略email识别 :<meta name="format-detection" content="telphone=no, email=no"/>
是否启用 WebApp 全屏模式:<meta name="apple-mobile-web-app-capable" content="yes" />
是否删除默认的苹果工具栏和菜单栏:<meta name="apple-mobile-web-app-capable" content="yes" /> 和9一样。
启用电话功能,请使用<a href="tel:15855555555">15855555555</a>来代替,邮件则为<a href="mailto:xxx@xxx.com">发送邮件</a>
windows phone 点击无高光
<meta name=”msapplication-tap-highlight” content=”no”>不让百度转码
<meta http-equiv=”Cache-Control” content=”no-siteapp” />设置“添加到主屏幕图标:用户可以像保存书签一样把一个网站添加到主屏幕,下次用户直接点击主屏幕上的图标就能进入网站。
<link rel=“apple-touch-icon-precomposed” href=“/apple-touch-icon-57×57-1.png”/>
<!– iPhone 和 iTouch,默认 57×57 像素,必须有 –>
<link rel=“apple-touch-icon-precomposed” sizes=“114×114” href=“/apple-touch-icon-114×114-precomposed.png”/>
<!– Retina iPhone 和 Retina iTouch,114×114 像素,可以没有,但推荐有 –>
<link rel=“apple-touch-icon-precomposed” sizes=“144×144” href=“/apple-touch-icon-144×144-precomposed.png”/>
<!– Retina iPad,144×144 像素,可以没有,但推荐有 –>
添加到主屏幕后系统会默认给图片加上IOS相关的图标风格(比如圆角),如果需要系统直接展示原图使用apple-touch-icon-precomposed,如果需要系统添加风格使用apple-touch-icon。
15、设置桌面图标的标题
<span style=“font-size:12px;”><meta name=“apple-mobile-web-app-title” content=“标题”></span>最好限制在六个中文长度内,超长的内容会被隐藏
16、设置启动画面:需要的百度下啊
移动端viewport设置:
<meta name="viewport" content="width=device-width,height=device-height, user-scalable=no,initial-scale=1, minimum-scale=1, maximum-scale=1,target-densitydpi=device-dpi ">
说明:
width: viewport 的高度 (数值/device-width) ,(范围从 200 到 10,000 ,默认为 980 像素 )
height : viewport 的高度 (数值/device-width) ,(范围从 223 到 10,000 )
user-scalable [yes | no] :是否允许缩放
initial-scale [数值] :初始化比例(范围从 > 0 到 10)
minimum-scale [数值] :允许缩放的最小比例
maximum-scale [数值] :允许缩放的最大比例
<!--社交标签 begin 参考微博API -->
<meta property="og:type" content="类型" />
<meta property="og:url" content="URL地址" />
<meta property="og:title" content="标题" />
<meta property="og:image" content="图片" />
<meta property="og:description" content="描述" />
h5 meta学习的更多相关文章
- 值得H5前端学习的60个JS插件(含DEMO演示)
下面也可以说是H5前端学习的js插件大全.基本包含了大部分的前端最前沿的js插件和库. 布局 SuperEmbed.js- 是一个Javascript库,可检测出网页上的内嵌视频并使他们能够变成响应式 ...
- H5的学习之旅-H5的实体(14)
H5有些关键字比如<等等是显示不出来的,这时候,就需要用实体来表示,实体我理解就是最初的编码 代码实例 <!DOCTYPE html> <html lang="en& ...
- H5 meta小结
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1, ...
- Viewprot meta学习笔记
viewprot屏幕尺寸,专为移动页面设计 参数 <meta name="viewport" content="height,width,initial-scale ...
- H5性能测试学习
工欲善其事,必先利其器,在做H5前端性能测试之前,选择合适的工具能让我们的测试工作事半功倍.本文要提到的工具有两类: 一类是抓包工具,如Fiddler.Charles等.这类工具不仅可以抓包,还可以对 ...
- 利用h5 meta 头标签设置og属性进行帖子分享图片时而有时而无
<meta property="og:title" content="fgsfg"> <meta property="og:desc ...
- H5 meta标签常用写法
<meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content=" ...
- H5案例学习笔记
★基础篇 增加主体结构元素
- H5 css学习
p{text-indent:2em;}段前空两格 段落排版--行间距(行高) p{line-height:1.5em;} 段落排版--中文字间距.字母间距 h1{ letter-spaci ...
随机推荐
- Linux安装解压缩版jdk
#解压到指定目录 tar zxvf ./jdk-7-Linux-i586.tar.gz -C /usr/lib/jvm 配置环境变量 #vi /etc/profile 编辑文件,在最后添加: ex ...
- chrome开发工具指南(十二)
使用 Device Mode 模拟移动设备 使用 Chrome DevTools 的 Device Mode 打造移动设备优先的完全自适应式网站.了解如何使用 Device Mode 模拟多种设备及其 ...
- jdbc预编译
详见:http://blog.yemou.net/article/query/info/tytfjhfascvhzxcytp20 JAVA_JDBC预编译 相关知识点 什么是预编译语句? 预编译语句P ...
- jvm系列 (五) ---类加载机制
类的加载机制 目录 jvm系列(一):jvm内存区域与溢出 jvm系列(二):垃圾收集器与内存分配策略 jvm系列(三):锁的优化 jvm系列 (四) ---强.软.弱.虚引用 我的博客目录 什么是类 ...
- Linux-kill命令(11)
kill:指定将信号发送给某个进程,常用来杀掉进程,可以通过ps.top命令来查看进程 在默认情况下: 采用编号为的TERM信号.TERM信号将终止所有不能捕获该信号的进程. 对于那些可以捕获该信号的 ...
- [js高手之路]Vue2.0基于vue-cli+webpack同级组件之间的通信教程
我们接着上文继续,本文我们讲解兄弟组件的通信,项目结构还是跟上文一样. 在src/assets目录下建立文件EventHandler.js,该文件的作用在于给同级组件之间传递事件 EventHandl ...
- 图像处理:卷积模块FPGA 硬件加速
本文记录了利用FPGA加速图像处理中的卷积计算的设计与实现.实现环境为Altera公司的Cyclone IV型芯片,NIOS II软核+FPGA架构. 由于这是第一次设计硬件加速模块,设计中的瑕疵以及 ...
- ps图层面板上的【透明度】与【填充】的区别
为文字添加投影,分别调图层面板上的[透明度]与[填充]的值你就知道区别了. 如上图降低填充的数值,结果只对文字颜色有影响却对投影毫无影响. 而如上图,调整不透明度的时候对文字颜色与投影均产生效果. 这 ...
- 简单的独享smb
1.是这样的,因为办公区域有一个千兆的交换机,但是我的台式机硬盘有点小,500G的,就把一个旧的台式网卡换成了千兆的,装了个CentOS6.5,最小化的,装了个samba,就开始用了: 2.由于是自己 ...
- 团队作业4----第一次项目冲刺(Alpha版本)4.29
a.站立式会议照片 会议内容: 会议讨论有一些内容要放在beta版本,所以燃尽图可能有些未完成.初级阶段我们只打算先写java代码的统计和显示.这是最基本的任务.在繁忙的任务中,不需要全部按照燃尽图. ...