• 基本

    <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. paip.提高效率---集合的存取括号方式 uapi java python php js 的实现比较

    paip.提高效率---集合的存取括号方式 uapi java python php js 的实现比较 ##java ----------- 在JDK1.7中,摒弃了Java集合接口的实现类,如:Ar ...

  2. paip.数组以及集合的操作uapi java php python总结..

    paip.数组以及集合的操作uapi 作者Attilax  艾龙,  EMAIL:1466519819@qq.com 来源:attilax的专栏 地址:http://blog.csdn.net/att ...

  3. 菜鸟日记-HTML-表格与表单

    一.表格 <table></table> width:宽度.可以用像素或百分比表示. border:边框,常用值0 cellpadding:内容跟单元格边框的边距.常用值0 a ...

  4. spring源码 — 三、AOP代理生成

    AOP代理生成 AOP就是面向切面编程,主要作用就是抽取公共代码,无侵入的增强现有类的功能.从一个简单的spring AOP配置开始: <?xml version="1.0" ...

  5. Leetcode-203 Remove Linked List Elements

    #203.   Remove Linked List Elements Remove all elements from a linked list of integers that have val ...

  6. 微软BI 之SSIS 系列 - 通过设置 CheckPoints 检查点来增强 SSIS Package 流程的重用性

    开篇介绍 通常一个 ETL Package 是由多个控制流和数据流共同组成,有的时候 ETL 的步骤可能会比较多,整个流程执行下来的时间可能比较长.假设在 ETL Package 中包含5个Task, ...

  7. 了解 JavaScript （4）– 第一个 Web 应用程序

    在下面的例子中,我们将要构建一个 Bingo 卡片游戏,每个示例演示 JavaScript 的不同方面,通过每次的改进将会得到最终有效的 Bingo 卡片. Bingo 卡片的内容 美国 Bingo ...

  8. Android 的EditText实现不可编辑

    android:editable is deprecated: Use an <EditText> to make it editable android:editable is depr ...

  9. activemq安装和启动

    安装环境:linux redhat activemq版本:5.8.0 1.从http://activemq.apache.org/download.html地址下载apache-activemq-5. ...

  10. DataTable 中varchar 转换为 Double 后重新 排序。

    DataTable  查询出某个字段为varchar 类型的.不过里面存的为数字,需要进行排序.可是如果直接排序就会不对.因为为varchar类型的,需要转换一下. 方法一: dt.Columns.A ...