昨天项目中用到了适应移动端显示的viewport,一般的使用方式如下:
<meta name="viewport" content="width=device-width, initial-scale=1.0">
但这样不能达到我想要的效果,及在竖屏时宽度为320像素,横屏时也是320像素,就是横屏时自动放大,
试了半天一直以为是调整width值的问题,最后才发现,原来要这样写:
<meta name="viewport" content="width=device-width">
只要不写默认放大比例initial-scale就可以了,又是费了很长时间的坑啊,不过最终搞定时还是很开心的
发现这种方法在ios系统中是可以的,但在安卓系统浏览器中还是没有生效,测试用的UC浏览器。
 
2014-03-20 09:51:53 

关于viewport的研究的更多相关文章

  1. 移动WEB viewport 相关知识

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

  2. 你可能不知道的viewport

    概述 前几天偶然看到一个pc端网页,发现用手机打开竟然同比缩放了,作为一个前端从业者,我自然想要弄清它到底是怎么缩放的.之后查了它的meta信息,css和js,发现没有任何兼容手机端的代码,那它到底是 ...

  3. 关于TileBrush中Viewbox,Viewport以及Stretch,AlignmentX/Y的详细研究

    我们知道TileBrush是WPF中一个战斗力爆表的虚基类,从它派生出的DrawingBrush,ImageBrush和VisualBrush在WPF图形编程中发挥着重要作用.然而关于TileBrus ...

  4. 【移动端兼容问题研究】javascript事件机制详解(涉及移动兼容)

    前言 这篇博客有点长,如果你是高手请您读一读,能对其中的一些误点提出来,以免我误人子弟,并且帮助我提高 如果你是javascript菜鸟,建议您好好读一读,真的理解下来会有不一样的收获 在下才疏学浅, ...

  5. 移动前端开发之viewport的深入理解

    在移动设备上进行网页的重构或开发,首先得搞明白的就是移动设备上的viewport了,只有明白了viewport的概念以及弄清楚了跟viewport有关的meta标签的使用,才能更好地让我们的网页适配或 ...

  6. 又到周末了,我们一起来研究【浏览器如何检测是否安装app】吧

    前言 扯淡 这个月比较倒霉,我送了女朋友一台笔记本电脑作为生日礼物,结果15天一过电脑就坏了,悲剧的我还把电脑盒子给扔了!淘宝不给换更不给退 于是被女朋友臭骂了一过星期后,今天本来在公司有任务的,但是 ...

  7. 基于淘宝弹性布局方案lib-flexible的问题研究

    上篇文章<淘宝弹性布局方案lib-flexible实践>结合一个简单的实例,说明了lib-flexible的基本用法,但是lib-flexible的这种适配方式在适配的时候会修改viewp ...

  8. CSS之viewport 2

    在这个迷你系列的文章里边我将会解释viewport,以及许多重要元素的宽度是如何工作的,比如<html>元素,也包括窗口和屏幕. 这篇文章我们来聊聊关于移动浏览器的内容.如果你对移动开发完 ...

  9. 简单研究Android View绘制三 布局过程

    2015-07-28 17:29:19 这一篇主要看看布局过程 一.布局过程肯定要不可避免的涉及到layout()和onLayout()方法,这两个方法都是定义在View.java中,源码如下: /* ...

随机推荐

  1. Test4J与Jtester单元测试常用注解比较

    package com.alibaba.ceres.catalog.biz.product.impl; import org.junit.After; import org.junit.Before; ...

  2. PAT 解题报告 1010. Radix (25)

    1010. Radix (25) Given a pair of positive integers, for example, 6 and 110, can this equation 6 = 11 ...

  3. SqlServer常用命令

    dbcc showfilestats 显示数据库空间占用情况 sp_spaceused tb_Test 显示表占用情况 如果包含有非dbo的Scheme,需要特殊处理,比如我们表tb_Test所使用的 ...

  4. Ruby操作VBA的注意事项和技巧(2):宏里调用和控制窗体以及窗体上的控件、不同workbook之间的宏互相调用

    4.宏里调用并控制窗体以及窗体上的各种控件 1 Sub Criterion_Check() 2 If Workbooks.count = 0 Then '如果当前没有打开的工作薄的话需要发出警告 3 ...

  5. CCSprite的使用方法大全

    一.精灵创建及初始化 1.从图片文件创建: CCSprite *sprite = [CCSprite spriteWithFile:@"ImageFileName.png"]; 默 ...

  6. WEB-INF/views/menu/list.jsp (line: 26, column: 58) equal symbol expected

    根本原因是由于单引号和双引号的混乱使用导致的. 解决办法: 将双引号里面的双引号改成单引号: 单引号里面的双引号该成单引号. 我的问题好像又不是这样的,<c:forEach var=" ...

  7. linux下MYSQL备份与恢复

    1.用命令实现备份 数据库备份是很重要的.如果定期做好备份,这样就可以在发生系统崩溃时恢复数据到最后一次正常的状态,把损失减小到最少.MySQLl提供了一个mysqldump命令,我们可以用它进行数据 ...

  8. sql xpath 查找包含

    select xcontent.query('/root//*[contains(text()[1], ''中'')]'), column1 from table

  9. android- Auto Monitor Logcat

    启动模拟器的时候弹出窗体: 它实在询问你是否显示logcat视图以便显示此工作空间中的程序信息. 因为如何程序错误,可以从logcat中看到错误的原因,建议选择yes. 单击确定,你会发现多了一个Lo ...

  10. [php笔记]项目开发五个阶段/雇员管理系统

    zend 公司,管理PHP版本的升级. 功能强大, 官方推荐. (开发一个PHP项目) 软件开发的五个阶段. 1.创建一个项目(工程)2.设置该项目的路径3.创建一个文件test.php ***使用Z ...