<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 禁止页面自动缩放的更多相关文章

  1. pc页面自动缩放到手机端

    今天做了个pc的页面,看了别人的网站在手机端能把pc端的网页刚好缩放到手机端,看着很舒服. 于是想把自己的页面也这样搞一下,刚开始,想到的是利用css3的缩放来做,想的是当屏幕尺寸改变时缩放整个页面, ...

  2. 点击<a>标签,禁止页面自动跳到顶部的解决办法

       最近在开发一个小web的时候想给一个按钮增加一个弹出dialog功能,但是发现点击按钮后页面总是自动滚动至顶部,这点从用户体验上来讲是极其不爽的,于是开始跳进google大池寻求解决办法.网上的 ...

  3. 苹果客户端input时页面自动放大的问题

    一.问题: 最近在用vue测试的时候发现,安卓端在输入框input时不存在页面自动缩放的问题,苹果客户端认为是考虑到用户的体验效果,才出现输入框自动放大的功能.但也收到了不少用户反馈体验效果不周. 二 ...

  4. pageresponse.min.js自动缩放页面改写

    /* * 名称 :移动端响应式框架 * 作者 :白树 http://peunzhang.cnblogs.com * 版本 :v2.1 * 日期 :2015.10.13 * 兼容 :ios 5+.and ...

  5. 适应移动端 iPhone & Android 微信页面的一些css属性

    1.-webkit-tap-highlight-color -webkit-tap-highlight-color:rgba(0,0,0,0);//透明度设置为0,去掉点击链接和文本框对象时默认的灰色 ...

  6. Android drawable的自动缩放

    今天在写程序时发现,一张图片被自动放大了,后来发现,这张图片放在了drawable-zh文件夹下,这个文件夹没有指定屏幕密度!于是将drawable-zh改为drawable-zh-nodpi,问题解 ...

  7. Android代码中动态设置图片的大小(自动缩放),位置

    项目中需要用到在代码中动态调整图片的位置和设置图片大小,能自动缩放图片,用ImageView控件,具体做法如下: 1.布局文件 <RelativeLayout xmlns:android=&qu ...

  8. Android Oreo 8.0 新特性实战 Autosizing TextView --自动缩放TextView

    Android Oreo 8.0 新特性实战 Autosizing TextView --自动缩放TextView 8.0出来很久了,这个新特性已经用了很久了,但是一直没有亲自去试试.这几天新的需求来 ...

  9. JS自动缩放页面图片

    /** * 缩略图 * * @param bool isScaling 是否缩放 * @param int width 宽度 * @param int height 高度 * @param strin ...

随机推荐

  1. [转] What is a Full Stack developer?

    期望一个凡人掌握开发过程中各个方面的知识,合理吗?也许不合理,但是Facebook正是要寻找这样的人.在一个OSCON会议上,一名Facebook的工程师告诉我的,他们只聘请“全能(Full stac ...

  2. 微信小程序开发总结(详细)

    转载: 小程序开发总结(详细) 这段时间一直在做小程序,总结下.后续可能会不断更新,努力写仔细点,争取让人看到就能会写. 一,页面结构. 这基本是小程序的标准目录结构.我们从上到下解释下:pages文 ...

  3. 线程8--GCD常见用法

    1.延迟执行 /***********************延迟第一种方法**************************/ /* 第一种方法, 调用NSObject的方法 [self perf ...

  4. js遇到的问题

    一些开发前台时遇到的小问题: ----------------------------------------- 一眼看出页面使用html还是html5: html有三种声明方式:<!DOCTY ...

  5. knockout事件绑定

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...

  6. idea 版本升级至最新版

    前言:当前最新版为官网上的2018.2.3版本 一.下载最新版 官网地址:http://www.jetbrains.com/idea/download/#section=windows 百度网盘地址: ...

  7. K:红黑树

      红黑树由AVL树改进而来,红黑树与AVL都是平衡结构的树.对于AVL树,其每次插入操作都需要从根节点处开始判断该树是否失去平衡,从而做出相应的调整.且其调整过程较为麻烦,每次都需要判断其左右两棵子 ...

  8. XML序列化与REST WCF Data Contract匹配时遇到的2个问题

    问题一: XML序列化与RESTful WCF Data Contract不能匹配,无法传递类的值. 现象: 给类加上[Serializable]Attribute,可以成功序列化,但是WCF Ser ...

  9. java图形界面之图形化按钮

    要将按钮图形化,只需创建一个ImageIcon对象,将图形路径赋予ImageIcon对象,然后将该对象传递给按钮即可. 此处涉及eclipse中图形的路径设置,包括(项目路径下.非项目路径下.相对路径 ...

  10. Yii 日期时间过滤列 filter

    在yii使用过程中,我们经常要使用到 按时间区间来检索数据 用gridview自身的filter就无法满足我们得需求. 下面可以用插件的方式来搞定: sydatecolumn 下载地址:http:// ...