(function(document) {
var dcl = document.documentElement, wh;
var scale = 1/window.devicePixelRatio;
document.querySelector('meta[name="viewport"]').setAttribute('content','initial-scale=' + scale + ', maximum-scale=' + scale + ', minimum-scale=' + scale + ', user-scalable=no');
function setRootRem() {
wh = dcl.clientHeight;
dcl.style.fontSize = 100 * (wh / 1334) + 'px';
} setRootRem();
document.addEventListener('DOMContentLoaded', setRootRem, false);
window.addEventListener('resize', setRootRem, false);
})(document);

但是这样会导致在iphone6时输出document.documentElement.clientWidth为750.与传统获取为375不符合。

移动端适配1px问题的更多相关文章

  1. css移动端适配 1px边框的解决方案

    .border{ width: 100px; height: 100px; position: relative; } //加上媒体查询更严谨一些 dpr为2的设配才进行缩放,dpr为1的设备边框就是 ...

  2. 从flexible.js引入高德地图谈起的移动端适配

    曾几何时,前端还仅仅是PC端的.随着移动时代的兴起,h5及css3的推陈出新.前端的领域慢慢的由传统的pc端转入了移动端,这也导致了前端这一职业在风口的一段时间出尽了风头. 从开始的惶恐和无从下手,慢 ...

  3. Web移动端适配总结

    移动端适配的相关概念以及几种方案总结 适配相关概念 布局视口(layout viewport):html元素的上一级容器即顶级容器,用于解决页面在手机上显示的问题.大部分移动设备都将这个视口分辨率设置 ...

  4. 小tips:使用rem+vw实现简单的移动端适配

    首先设置meta属性,如下代码: <meta name="viewport" content="width=device-width, initial-scale= ...

  5. 移动端适配--flexible.js

    引言: H5适配一直是一个比较普遍的问题,很多文章都会讲,最近开发了一个H5的项目使用了一下淘宝的 flexible.js,写一篇文章自己总结一下. 一.背景介绍: Flexible.js是淘宝公开的 ...

  6. 移动端适配之sprite雪碧图背景定位

    移动端适配一般我会使用rem进行适配,大致操作就是按照一定尺寸设计稿进行制作,最后将所有px值转换为rem,但是一些手机背景精灵图(cssSprite)就会出现一些误差(1px左右),如果公司要求不高 ...

  7. 移动端适配之雪碧图(sprite)背景图片定位

    为了减少网络请求个数量,提高网站的访问速度,我们一般都会把一些小的图片合并成一张sprite图,然后根据background-position来进行定位.在web端由于是固定的大小与left .top ...

  8. 手淘H5移动端适配方案flexible源码分析

    移动端适配一直是一个值得探讨的问题,在业余时间我找了一些页面,查看了一些厂商对于移动端H5页面的适配方案,看到了几个典型的例子,今天就来记录一下我看到的第一个典型的例子,也是我们公司目前普通H5项目正 ...

  9. 解决vue移动端适配问题

    1,先看看网上关于移动端适配讲解 再聊移动端页面适配,rem和vw适配方案! 基础点:rem相对根节点字体的大小.所以不用px; 根字体:字体的大小px; px:你就当成cm(厘米)这样的东西吧: 基 ...

随机推荐

  1. Python中sort与sorted函数

    python中列表的内置函数sort()可以对列表中的元素进行排序,而全局性的sorted()函数则对所有可迭代的序列都是适用的: 并且sort()函数是内置函数,会改变当前对象,而sorted()函 ...

  2. vectors 使用应该注意到的问题

    ector1. vector的元素必须具备 assignable和 copyable . 2.vector的迭代器是随机存取迭代器. 3.要考虑到vector的大小(size)和容量(capacity ...

  3. Openssl genpkey命令

    一.简介 genpkey命令用于产生各种密钥(RSA.DSA.DH.EC等)的私钥值. 二.语法 openssl genpkey [-out filename] [-outform PEM | DER ...

  4. 13.JOIN

    SQL join 用于根据两个或多个表中的列之间的关系,从这些表中查询数据 CREATE TABLE IF NOT EXISTS zz0 (number INT(11)); CREATE TABLE ...

  5. 不错的silverlight教程

    http://www.visifire.com/documentation/Visifire_Documentation/Charts/Reference/Chart_Elements_Referen ...

  6. Java日志组件logback使用:加载非类路径下的配置文件并设置定时更新

    Java日志组件logback使用:加载非类路径下的配置文件并设置定时更新 摘自: https://blog.csdn.net/johnson_moon/article/details/7887449 ...

  7. WEBAPI使用过滤器对API接口进行验证

    用户登录控制器:[ActionFilter]自定义过滤器 用户信息:var userData = new JObject();                   userData.Add(" ...

  8. vmware ubuntu安装vmware tools

    vmware tools可以说是其平台虚拟机必不可少的工具,可以使母机(你的电脑)通过复制粘贴向虚拟机中传递文件信息,对我们虚拟机的使用由非常大的帮助,当然也可以通过使用共享硬盘来共享文件,但操作起来 ...

  9. springboot调用微信的jscode2session报JSONObject异常

    问题背景: 服务器为Centos6.5 JDK:OpenJDK1.7 tomcat7 项目为微信小程序api的后端代码,解密用户信息,代码是采用springboot写的 异常信息: 代码: json异 ...

  10. DELPHI XE5轻松输出到MacOsX

    配置:MACOSX10.9.3 +XCODE5.1 + VBOX + WINXP + DELPHI XE 5UP2 配置步骤从略. 1.选择firemonkey desktop application ...