我们在开发移动设备的网站时，最常见的的一个动作就是把下面这个东西复制到我们的head标签中：

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">

解释：

width - viewport的宽度
height - viewport的高度
initial-scale - 初始的缩放比例
minimum-scale - 允许用户缩放到的最小比例
maximum-scale - 允许用户缩放到的最大比例
user-scalable - 用户是否可以手动缩放

例子：

<!DOCTYPE html><html> <head> 　　<meta charset="utf-8"> 　　<meta http-equiv="X-UA-Compatible" content="IE=edge"> 　　<title>我的生活</title>
　　<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
　　<link rel="shortcut icon" href="/favicon.ico">
　　<meta name="apple-mobile-web-app-capable" content="yes">
　　<meta name="apple-mobile-web-app-status-bar-style" content="black">
</head>
<body>
　　<!-- 你的html代码 -->
　　<script type='text/javascript' src='js/jquery.min.js' charset='utf-8'></script>
</body>
</html>

webapp-viewport 相关知识整理的更多相关文章

  1. Redis相关知识整理

    Redis相关知识整理 1. Redis和MySQL的区别?a).mysql是关系型数据库,而redis是NOSQL,非关系型数据库.mysql将数据持久化到硬盘,读取数据慢,而redis数据先存储在 ...

  2. 移动WEB viewport 相关知识

    了解移动web viewport的知识,主要是为了切图时心中有数.本文主要围绕一个问题:切图时怎样设置<meta name="viewport">相关参数?围绕这个问题 ...

  3. podSpec文件相关知识整理

    上一篇文章整理了我用SVN创建私有库的过程,本文将整理一下有关podSpec文件的相关知识. podSpec中spec的全称是“Specification”,说明书的意思.顾名思义,这是用来描述你这个 ...

  4. OpenCV&Qt学习之四——OpenCV 实现人脸检测与相关知识整理

    开发配置 OpenCV的例程中已经带有了人脸检测的例程,位置在:OpenCV\samples\facedetect.cpp文件,OpenCV的安装与这个例子的测试可以参考我之前的博文Linux 下编译 ...

  5. [Cxf] cxf 相关知识整理

    ① 请求方式为GET @GET @Path(value = "/userAddressManage") @Produces( { MediaType.APPLICATION_JSO ...

  6. JVM的相关知识整理和学习--(转载)

    JVM是虚拟机,也是一种规范,他遵循着冯·诺依曼体系结构的设计原理.冯·诺依曼体系结构中,指出计算机处理的数据和指令都是二进制数,采用存储程序方式不加区分的存储在同一个存储器里,并且顺序执行,指令由操 ...

  7. Web缓存相关知识整理

    一.前言  工作上遇到一个这样的需求,一个H5页面在APP端,如果勾选已读状态,则下次打开该链接,会跳过此页面.用到了HTML5 的本地存储 API 中的 localStorage作为解决方案,回顾了 ...

  8. java中的字符串相关知识整理

    字符串为什么这么重要 写了多年java的开发应该对String不陌生,但是我却越发觉得它陌生.每学一门编程语言就会与字符串这个关键词打不少交道.看来它真的很重要. 字符串就是一系列的字符组合的串,如果 ...

  9. Android 基本控件相关知识整理

    Android应用开发的一项重要内容就是界面开发.对于用户来说,不管APP包含的逻辑多么复杂,功能多么强大,如果没有提供友好的图形交互界面,将很难吸引最终用户.作为一个程序员如何才能开发出友好的图形界 ...

  10. 【杂谈】FilterChain相关知识整理

    前言 做后台的,Filter肯定没少配置,但是知晓其原理的可能不多.在这之前我也不懂,但这并不影响业务开发,同时也有其他的知识要学,所以一直就没看.这阵子有点闲,刚好在看<How Tomcat ...

随机推荐

  1. 在 U-BOOT 对 Nand Flash 的支持

    1.1    U-BOOT 对从 Nand Flash 启动的支持 1.1.1   从 Nand Flash 启动 U-BOOT 的基本原理 1. 前 4K 的问题 如果 S3C2410 被配置成从 ...

  2. 笔记-ubuntu19共享文件夹

    这篇文章记录ubuntu和windows共享文件夹的步骤,环境是ubuntu19,两种方法,一种是图形化界面,一种是命令行. 图形化界面 打开文件软件,找到需要分享的文件夹,点击右键-属性-本地网络共 ...

  3. Ansible-playbook简单应用的几个实例

    ①ansible-playbook的循环: 重复执行某任务:对迭代项的引用,固定变量名为“item”,而后要在task中使用with_items给定要迭代的元素列表,列表方法:字符串/字典(类似jso ...

  4. Entity Framework 学习记录

    msdn  :https://msdn.microsoft.com/zh-cn/data/ee712907.aspx code first 入门: https://msdn.microsoft.com ...

  5. 关于Cadence SPB 16.6 破解的一些关键步骤

    网上搜索到的破解方法,一般来说流程都是没有什么大问题的.较详细的一个破解流程可参照: http://www.mr-wu.cn/cadence-orcad-allegro-spb-16-6-instal ...

  6. php多维数组

    一个数组中的值可以是另一个数组,另一个数组的值也可以是一个数组.依照这种方式,我们可以创建二维或者三维数组: 实例 <?php // A two-dimensional array: $cars ...

  7. 杂项-公司：Microsoft

    ylbtech-杂项-公司:Microsoft 微软,是一家美国跨国科技公司,也是世界PC(Personal Computer,个人计算机)软件开发的先导,由比尔·盖茨与保罗·艾伦创办于1975年,公 ...

  8. 微信开发SDK支持小程序 ，Jeewx-Api 1.3.1 版本发布

    JEEWX-API 是一款JAVA版的微信开发SDK,支持微信公众号.小程序.微信企业号.支付宝生活号SDK和微博SDK.你可以基于她 快速的傻瓜化的进行微信开发.支付窗开发和微博开发. 基于jeew ...

  9. PAT甲级——A1080 Graduate Admission

    It is said that in 2011, there are about 100 graduate schools ready to proceed over 40,000 applicati ...

  10. 前端之CSS初识

    figure:last-child { margin-bottom: 0.5rem; } #write ol, #write ul { position: relative; } img { max- ...