• 基本

    <meta name="viewport" content="width=device-width, initial-scale=1">
    1920x1080的手机，对于html5的页面来讲，获得的device-width,一般是420px，这个值是经过浏览器转换过的，与屏幕像素宽度不同

  • A pixel is not a pixel
    html5页面中使用px，是经过转换的，一般是有多个screen像素组成一个html5页面像素，相当于android里的dp

  • html5 css pixel = screen.width / devicePixelRatio

HTML5[2]:使用viewport控制手机浏览器布局的更多相关文章

  1. 使用视 meta 标签来控制手机浏览器布局

    移动浏览器的Fennec一样呈现在一个虚拟的"窗口"页面(视),通常比屏幕宽.所以他们不需要去挤每个页面布局到一个小窗口(这会破坏许多非移动优化的网站) .用户可以平移和缩放才能看 ...

  2. 响应式布局中重要的meta标签设置.适用于手机浏览器兼容性设置

    <!-- #手机浏览器兼容性设置 -->    <meta content="application/xhtml+xml;charset=UTF-8" http- ...

  3. html5手机浏览器启动微信客户端支付实例

    html5手机浏览器启动微信客户端支付实例,外部浏览器html5微信支付技术,如何在手机浏览器微信支付,在微信客户端外的移动端网页使用微信支付 首先在微信支付官网https://pay.weixin. ...

  4. 如何做好移动端的响应式设计：Viewport控制

    新人翻译,欢迎转载~ 英文原文地址:http://bitsofco.de/2015/respove-design-viewport/ 原文例程地址:https://github.com/ireade/ ...

  5. 手机浏览器自动播放视频video（设置autoplay无效）的解决方案

    1.问题的提出 某一天接了个需求,需要在手机的H5页面内加入视频,我开开心心做完,准备交付的时候,问题来了,PM想要用户一进入页面,视频就开始播放,不需要用户手动点击. 2.尝试解决 加autopla ...

  6. [Mobile] 手机浏览器输入框-数字输入框

    手机浏览器的输入框,一直都是以web的方式进行开发的,没有关注到用户体验,领导提出了输入框要弹出数字输入框,想来应该有这种技术能实现.   搜索之后发现可以使用type="number&qu ...

  7. wp8手机浏览器项目

    项目需求如下: 1.页面布局 最上方为搜索/网址框 中间为网页显示区,默认主页为百度搜索 最下方为功能栏,分别有后退,前进,窗口和更多功能 在更多功能中有 分享给好友 发送网址到桌面 查看历史记录等 ...

  8. SlimerJS – Web开发人员可编写 JS 控制的浏览器

    SlimerJS 是一个提供给 Web 开发人员,可通过脚本编程控制的浏览器.它可以让你使用 Javascript 脚本操纵一个网页:打开一个网页,点击链接,修改的内容等,这对于做功能测试,页面自动机 ...

  9. css3在不同型号手机浏览器上的兼容一览表

    网上搜集了css3对不同系统手机浏览器的支持情况(ios/android/winphone)备份一下以便查看.  以下资料由微信产品部"白树"整理, 转载请注明. √:完全支持   ...

随机推荐

  1. JNI技术基础(1)——从零开始编写JNI代码

    众所周知,Java程序的最大特点就是其跨平台的特性,编写的上层应用程序可以不加任何修改甚至不用重新编译而运行于不同的平台上,然而,Java本身也存着这一个弊端,那就是性能上相对要差一些,在对性能要求比 ...

  2. springmvc中@PathVariable和@RequestParam的区别

    顾名思义, @PathVariable和@RequestParam,分别是从路径里面去获取变量,也就是把路径当做变量,后者是从请求里面获取参数. 我的url; http://localhost:808 ...

  3. 还有人在用SQL Server 2000或2005吗？ 2014来了！

    你的项目,还在用SQL Server 2000或2005吗? 很多人甚至还没有来得及用过SQL Server 2008,SQL Server 2012,现在SQL Server 2014已经出来了! ...

  4. Revit API 楼板开洞

    start [Transaction(TransactionMode.Manual)] [Regeneration(RegenerationOption.Manual)] , , ) *  / , - ...

  5. ClamAV安装使用及API例子

    ClamAV是一款由Sourcefire组织开发的开源杀毒引擎,Sourcefire同时也是Snort入侵检测引擎的所有者.ClamAV提供了一种更为快速灵活的框架用以检测恶意代码和软件产品.可以作为 ...

  6. J2EE Web开发入门—通过action是以传统方式返回JSON数据

    关键字:maven.m2eclipse.JSON.Struts2.Log4j2.tomcat.jdk7.Config Browser Plugin Created by Bob 20131031 l ...

  7. 分享一些无特征PHP一句话

    分享些不需要动态函数.不用eval.不含敏感函数.免杀免拦截的一句话.(少部分一句话需要php5.4.8+.或sqlite/pdo/yaml/memcached扩展等) 原理:https://www. ...

  8. Hadoop学习篇 2 初识 Hadoop

    在一个全配置的集群上,运行Hadoop意味着在网络分布的不同服务器上运行一组守护进程 (daemons),这些守护进程或运行在单个服务器上,或运行与多个服务器上,他们包括: (1) NameNode( ...

  9. callable object与新增的function相关 C++11中万能的可调用类型声明std::function<...>

    在c++11中,一个callable object(可调用对象)可以是函数指针.lambda表达式.重载()的某类对象.bind包裹的某对象等等,有时需要统一管理一些这几类对象,新增的function ...

  10. myeclipse9或myeclipse10安装svn的方法

    下载最新的SVN包   site-1.6.5.zip 从中解压出features与plugins文件夹,复制到C:\toBeInstalledSVN 里面,其它的*.xml文件不要 复制下列java代 ...