(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. Scala介绍

    强大的编程语言 Scala 是一门非常强大的语言,它允许用户使用命令和函数范式进行编写代码,因此,编程时你可以使用常用的命令式语句,就像我们使用 C.Java.PHP 以及很多其他语言一样,而且,你也 ...

  2. python asyncio 异步实现mongodb数据转xls文件

    from pymongo import MongoClient import asyncio import xlwt import json class Mongodb_Transfer_Excel( ...

  3. oracle使用exp/imp导入导出(用户)

    实例,从远程机器上导出nxgy用户的所有对象和数据,然后导入到本机数据库的nxgy用户里(用户名可自定义) 如果本机nxgy用户已经存在(数据没用,可以删除),级联删除用户所有对象 首先,从远程机器上 ...

  4. 一次shell中seq的处理

    一次shell中seq的处理 背景:用要shell 提取 文件中内容,文件名是用序列号如下生成,文件差不多有将近400多w个  如下:  www.ahlinux.com 原始脚本#! /bin/sh# ...

  5. DataTable 转换成匿名集合类

    using System;using System.CodeDom.Compiler;using System.Collections.Generic;using System.Data;using ...

  6. MSGPACK和PROTOBUF的故事(MSGPACK明显生产力不足)

    作者曾经在2014年测试出MSGPACK的关键字和中文字符有很大的冲突,所以后来放弃了,本文为很多年前写的一个对比,后来我们一直在使用HTTP协议和PROTOBUF. 看看MSGPACK的文档,自称效 ...

  7. 何为软件的Alpha、Beta、RC和GA发布版本?

    简介 一个软件或者一个功能在发布时,通常会有Beta版这么一说.我很熟悉,差不多知道是什么意思,但没去深究,感觉上就是一个可以用但不保证功能稳定的版本. 直到昨天我看到了 MariaDB 数据库发布标 ...

  8. datetime 2017-10-21 10:09:02.560 转年月日的时间类型

    sql语句时间转年月日格式: 适用于多种时间格式 select  REPLACE(STUFF(CONVERT(char(10), REPLACE(CONVERT(varchar(10),'2017-1 ...

  9. Struts2 配置及运行时遇到问题

    1.java.lang.ClassNotFoundException: org.apache.struts2.dispatcher.filter.StrutsPrepareAndExecuteFilt ...

  10. 20169219 实验三 敏捷开发与XP实践 报告

    实验内容 1.求命令行传入整数参数的和. package exp3; public class TestArgs01 { public static void main(String[] args) ...