iPhone/android的viewport 禁止页面自动缩放
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, target-densitydpi=device-dpi" />
属性解释:
1.width
width设置viewport的宽度,即iphone最初模拟PC浏览器的宽度,之后iphone会这个宽度展现的页面同比缩放到iphone屏幕上。设置width=device-width后就不会再进行缩放了,因为宽度正好和iphone的宽度相同(前提是没有设置缩放比例)。
2.minimum-scale和maximum-scale
控制用户允许设置的缩放比例的。
3.user-scalable
标识是否允许对页面进行缩放,取值有两个yes和no。设置为no则不允许进行页面缩放了。
4.initial-scale
设置用户最初看到页面时的缩放比例。
5.target-densitydpi
Android 浏览器所需要的,因为 Android 硬件设备标准不一, 其中同样物理尺寸的屏幕,可能因为 dpi 的不同而具有不同的分辨率,
Android 浏览器默认会缩放页面以便最好地呈现, 可惜和 Java 的垃圾回收一样,它很难做到"最好"。所以最好还是人工指定吧。
target-densitydpi 可以设定的值
device-dpi - 设备本身的像素
high-dpi -用高像素,中低像素屏幕适当缩小。
medium- 中等像素,高的屏幕放大,低的变小是默认值
low-dpi - 低像素,中高像素会适当变大。
iPhone/android的viewport 禁止页面自动缩放的更多相关文章
- pc页面自动缩放到手机端
今天做了个pc的页面,看了别人的网站在手机端能把pc端的网页刚好缩放到手机端,看着很舒服. 于是想把自己的页面也这样搞一下,刚开始,想到的是利用css3的缩放来做,想的是当屏幕尺寸改变时缩放整个页面, ...
- 点击<a>标签,禁止页面自动跳到顶部的解决办法
最近在开发一个小web的时候想给一个按钮增加一个弹出dialog功能,但是发现点击按钮后页面总是自动滚动至顶部,这点从用户体验上来讲是极其不爽的,于是开始跳进google大池寻求解决办法.网上的 ...
- 苹果客户端input时页面自动放大的问题
一.问题: 最近在用vue测试的时候发现,安卓端在输入框input时不存在页面自动缩放的问题,苹果客户端认为是考虑到用户的体验效果,才出现输入框自动放大的功能.但也收到了不少用户反馈体验效果不周. 二 ...
- pageresponse.min.js自动缩放页面改写
/* * 名称 :移动端响应式框架 * 作者 :白树 http://peunzhang.cnblogs.com * 版本 :v2.1 * 日期 :2015.10.13 * 兼容 :ios 5+.and ...
- 适应移动端 iPhone & Android 微信页面的一些css属性
1.-webkit-tap-highlight-color -webkit-tap-highlight-color:rgba(0,0,0,0);//透明度设置为0,去掉点击链接和文本框对象时默认的灰色 ...
- Android drawable的自动缩放
今天在写程序时发现,一张图片被自动放大了,后来发现,这张图片放在了drawable-zh文件夹下,这个文件夹没有指定屏幕密度!于是将drawable-zh改为drawable-zh-nodpi,问题解 ...
- Android代码中动态设置图片的大小(自动缩放),位置
项目中需要用到在代码中动态调整图片的位置和设置图片大小,能自动缩放图片,用ImageView控件,具体做法如下: 1.布局文件 <RelativeLayout xmlns:android=&qu ...
- Android Oreo 8.0 新特性实战 Autosizing TextView --自动缩放TextView
Android Oreo 8.0 新特性实战 Autosizing TextView --自动缩放TextView 8.0出来很久了,这个新特性已经用了很久了,但是一直没有亲自去试试.这几天新的需求来 ...
- JS自动缩放页面图片
/** * 缩略图 * * @param bool isScaling 是否缩放 * @param int width 宽度 * @param int height 高度 * @param strin ...
随机推荐
- HDU 1863 畅通工程(Prim算法求解MST)
题目: 省政府“畅通工程”的目标是使全省任何两个村庄间都可以实现公路交通(但不一定有直接的公路相连,只要能间接通过公路可达即可).经过调查评估,得到的统计表中列出了有可能建设公路的若干条道路的成本.现 ...
- 使用JS导出页面内容到Excel
JS代码 <script> $(function(){ // 使用outerHTML属性获取整个table元素的HTML代码(包括<table>标签),然后包装成一个完整的HT ...
- .net mvc Razor 三元运算判断赋值 ?:
预期效果: 当Model中的Age数字列值为0时,不显示该值. <input type="text" class="form-control onlyPositiv ...
- APPCAN的mas服务报错
报错信息 主要是: [meap_im_java]load java warning { [Error: Cannot find module 'java'] code: 'MODULE_NOT_FOU ...
- Intellij IDEA run coverage之覆盖率测试
Intellij IDEA run coverage之覆盖率测试 idea 的coverage + 我们自己写的测试用例.最后看一下,我们要测的代码有没有测试到,这是一个不错的提高代码质量的方法. i ...
- 中小型研发团队架构实践七:集中式日志ELK
一.集中式日志 日志可分为系统日志.应用日志以及业务日志,系统日志给运维人员使用,应用日志给研发人员使用,业务日志给业务操作人员使用.我们这里主要讲解应用日志,通过应用日志来了解应用的信息和状态,以及 ...
- Linux:curl
curl命令用来做HTTP协议的客户端,可以通过命令参数生成各种请求,非常强大. 1. GET 默认情况下下curl执行的是GET操作,所以可以当做wget使用如 $ curl https://www ...
- Yii CGridView 关联表搜索排序实例
在这篇文章中,我准备讲解如何在CGridView中搜索或者排序关联表中的某一行,通过给Yii Blog demo添加一个list页面. 首先,检查你的blog demo里的protected\mode ...
- Docker for Windows(四)实践搭建&删除MySQL服务
我们已经下载安装好了Docker for Windows:Docker for Windows(一)下载与安装,也简单了解了Docker常用命令:Docker for Windows(三)Docker ...
- GIT 这么好用,为什么还是有人不知道怎么用它提交代码?
客户端代码管理工具的变迁: 从 SVN 到 GIT 截止目前,新版的 APICloud Studio 2 仍然处于公测期.APICloud Studio 2 的代码管理客户端,由 SVN 改为了 GI ...