1. 定义针对搜索引擎的关键词:<meta name="keywords" content="meta,red" />

  2. 定义对页面的描述:<meta name="description" content="这是meta教程" />

  3. 定义页面的最新版本:<meta name="revised" content="bu, 2016/5/10/" />

  4. 每 5 秒刷新一次页面:<meta http-equiv="refresh" content="5" />

  5. 网页作者: <meta name="author" content="name, email@gmail.com"/>

  6. 添加智能 App 广告条(iOS 6+ Safari):<meta name="apple-itunes-app" content="app-id=myAppStoreID, affiliate-data=myAffiliateData, app-argument=myURL">

  7. 设置苹果工具栏颜色:<meta name="apple-mobile-web-app-status-bar-style" content="black"/>

  8. 忽略页面中的数字识别为电话,忽略email识别 :<meta name="format-detection" content="telphone=no, email=no"/>

  9. 是否启用 WebApp 全屏模式:<meta name="apple-mobile-web-app-capable" content="yes" />

  10. 是否删除默认的苹果工具栏和菜单栏:<meta name="apple-mobile-web-app-capable" content="yes" />  和9一样。

  11. 启用电话功能,请使用<a href="tel:15855555555">15855555555</a>来代替,邮件则为<a href="mailto:xxx@xxx.com">发送邮件</a>

  12. windows phone 点击无高光 

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

  13. 不让百度转码

    <meta http-equiv=”Cache-Control” content=”no-siteapp” />

  14. 设置“添加到主屏幕图标:用户可以像保存书签一样把一个网站添加到主屏幕,下次用户直接点击主屏幕上的图标就能进入网站。

<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学习的更多相关文章

  1. 值得H5前端学习的60个JS插件(含DEMO演示)

    下面也可以说是H5前端学习的js插件大全.基本包含了大部分的前端最前沿的js插件和库. 布局 SuperEmbed.js- 是一个Javascript库,可检测出网页上的内嵌视频并使他们能够变成响应式 ...

  2. H5的学习之旅-H5的实体(14)

    H5有些关键字比如<等等是显示不出来的,这时候,就需要用实体来表示,实体我理解就是最初的编码 代码实例 <!DOCTYPE html> <html lang="en& ...

  3. H5 meta小结

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

  4. Viewprot meta学习笔记

    viewprot屏幕尺寸,专为移动页面设计 参数 <meta name="viewport" content="height,width,initial-scale ...

  5. H5性能测试学习

    工欲善其事,必先利其器,在做H5前端性能测试之前,选择合适的工具能让我们的测试工作事半功倍.本文要提到的工具有两类: 一类是抓包工具,如Fiddler.Charles等.这类工具不仅可以抓包,还可以对 ...

  6. 利用h5 meta 头标签设置og属性进行帖子分享图片时而有时而无

    <meta property="og:title" content="fgsfg"> <meta property="og:desc ...

  7. H5 meta标签常用写法

    <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content=" ...

  8. H5案例学习笔记

    ★基础篇     增加主体结构元素    

  9. H5 css学习

    p{text-indent:2em;}段前空两格   段落排版--行间距(行高) p{line-height:1.5em;} 段落排版--中文字间距.字母间距  h1{    letter-spaci ...

随机推荐

  1. HTML5_input_file_打开很慢的问题

    最近项目中有上传附件的功能,只是在chrome浏览器上面测试,发现上传附件,打开选择框比较慢 原文链接:http://www.foreverpx.cn

  2. 你所不知道的 CSS 滤镜技巧与细节

    承接上一篇你所不知道的 CSS 动画技巧与细节,本文主要介绍 CSS 滤镜的不常用用法,希望能给读者带来一些干货! OK,下面直接进入正文.本文所描述的滤镜,指的是 CSS3 出来后的滤镜,不是 IE ...

  3. Project 8:利用递归算法求最大值

    目标:用递归算法实现求一个数组中的最大元素. 样例输入 5 1 4 2 5 3 样例输出 5 #include <stdio.h> int max(int *,int); int main ...

  4. Springboot与Thymeleaf模板引擎整合基础教程(附源码)

    前言 由于在开发My Blog项目时使用了大量的技术整合,针对于部分框架的使用和整合的流程没有做详细的介绍和记录,导致有些朋友用起来有些吃力,因此打算在接下来的时间里做一些基础整合的介绍,当然,可能也 ...

  5. 大数的减法函数--c语言

    代码展示:   http://paste.ubuntu.com/23693598/ #include<stdio.h> #include<stdlib.h> #include& ...

  6. 201521123079《java程序设计》第7周学习总结

    1. 本周学习总结 以你喜欢的方式(思维导图或其他)归纳总结集合相关内容. 2. 书面作业 1.ArrayList代码分析 1.1 解释ArrayList的contains源代码 public boo ...

  7. 201521123100 《Java程序设计》第9周学习总结

    1. 本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结异常相关内容. 2. 书面作业 1.本次PTA作业题集异常 常用异常 题目5-1 1.1 截图你的提交结果(出现学号) 1.2 自己 ...

  8. 201521123114《Java程序设计》第9周学习总结

    1. 本章学习总结 2. 书面作业 Q1. 常用异常 题目5-1 1.1 截图你的提交结果(出现学号) 1.2 自己以前编写的代码中经常出现什么异常.需要捕获吗(为什么)?应如何避免? 经常出现的异常 ...

  9. c# 浮点数计算问题

    给大家看个计算题,看看大家的算术能力. 0.1 +0.1 +0.1 - 0.3 等于几? 大家可能会说这么简单的问题,是不是看不起我?肯定等于0啊. 如果大家直接算的是没有问题的,但是如果用计算机呢? ...

  10. 创建maven项目pom.xml第一行报错

    之前也创建过几次maven项目,也是第一行报错,之前直接是右键项目强制更新maven好像就解决了,这次遇见这个问题使用这个方法好像不起作用了,给的一堆英文报错又看不懂,幸好在网上看见路人甲大神提示,根 ...