根据设计稿的高度，除以相对应的数字

<script type="text/javascript">
// 把尺寸放大N倍（N是window.devicePixelRatio）
var wd = document.documentElement.clientWidth*window.devicePixelRatio/7.5;
document.getElementsByTagName("html")[0].style.fontSize = wd + "px";
</script>

rem 布局代码的更多相关文章

  1. rem布局完成响应式开发，通俗且详细的原理解析和代码实现

    一.rem布局基本原理 原理:rem可以理解为一个长度单位,单位rem的值等于网页font-size的值.如果网页的字体大小为默认值16px,那么1rem就等于16px,0.5rem等于8px. 根据 ...

  2. 响应式自适应布局代码,rem布局

    响应式自适应布局代码 首先是先设置根字体大小,PC端一般是16px为根字体,移动端会有不同的,根据情况来设置 js部分 document.querySelector('html').style.fon ...

  3. 手机端页面自适应解决方案-rem布局

    rem布局 布局前插入原生js即可 (function (doc, win) { var docEl = doc.documentElement, resizeEvt = 'orientationch ...

  4. 手机端页面自适应解决方案—rem布局

    只需在页面引入这段原生js代码就可以了 (function (doc, win) { var docEl = doc.documentElement, resizeEvt = 'orientation ...

  5. 一看就懂得移动端rem布局、rem如何换算

    这里使用了js控制根元素的font-size大小,然后进行rem换算,在js代码后面会说明以下问题. 1.如何进行rem运算? 2.如果纯js控制根元素用rem布局会出现的小问题,如何解决? 3.如有 ...

  6. （淘宝无限适配）手机端rem布局详解（转载非原创）

    从网易与淘宝的font-size思考前端设计稿与工作流 本文结合自己对网易与淘宝移动端首页html元素上的font-size这个属性的思考与学习,讨论html5设计稿尺寸以及前端与设计之间协作流程的问 ...

  7. webapp，liveapp： 流式布局和rem布局

    liveapp场景应用,一般针对的是移动端,近来也是很火,颇有一些感受,拿来分享一下. 页面宽度范围: 一般移动端页面我们的像素范围是320px-640px,最大640px,最小320px,所以设计稿 ...

  8. 移动端rem布局和百分比栅格化布局

    移动端的rem: 使用方法: 设置html的font-size,根据浏览器分辨率缩放 设置根元素font-size为100px这样好用的值,不要设为10px这样的: 然后获取浏览器的分辨率,也就是视口 ...

  9. 手机端页面自适应：rem布局

    rem布局非常简单,首页你只需在页面引入这段原生js代码就可以了 (function (doc, win) { var docEl = doc.documentElement, resizeEvt = ...

随机推荐

  1. js 监听input 实现数据绑定

    <!DOCTYPE html> <html> <head> <script> function checkField(val) { //alert(&q ...

  2. 封装一个Js 对象 生成Json

    <script src="~/Content/Scripts/jquery-1.11.3.min.js"></script> <script> ...

  3. JS异步事件顺序：setTimeout,async,promise

    为什么最近更新那么频繁,还不是因为笔试的时候瞎了? 先说异步事件执行顺序的规则: 1. 定时器异步队列和promise队列不是同一队列,promise优先级高于setTimeout; 2. 创建pro ...

  4. create-react-app创建项目后，运行npm run eject报错解决方法

    运行npm run eject报错解决方法 主要问题是脚手架添加.gitgnore文件,但是却没有本地仓库,使用以下命令操作以下就可以了 git init git add . git commit - ...

  5. Linux拓展练习部分--输入输出 / find部分 /基础拓展2

    目录 输入输出部分 find部分 基础阶段-拓展练习2 输入输出部分 1.输入时间命令"date"将当前系统时间输出到/data/1.txt [root@centos7 ~]# d ...

  6. 横纵方向走马灯滚动，纯javascript代码

    <body onload="beginmarquee()"> <table width="1024" border="0" ...

  7. 解决 'express' 不是内部或外部命令，也不是可运行的程序

    express-generator >npm install -g express-generator 就可以了

  8. Spring 讲解(一 )

    1.如何理解 Spring 框架 简单来说,Spring 是一个轻量级的控制反转(IoC)和面向切面(AOP)的容器框架. 因为以前写代码的时候,在使用类对象的时候,经常需要实例化创建(new 出来) ...

  9. xcode Delete current line

    Delete a line like eclipse CTRL+D (tested on Xcode 4.5.1) : First of all, change these rights : sudo ...

  10. 探索Redis设计与实现2：Redis内部数据结构详解——dict

    本文转自互联网 本系列文章将整理到我在GitHub上的<Java面试指南>仓库,更多精彩内容请到我的仓库里查看 https://github.com/h2pl/Java-Tutorial ...