文档章节

移动端rem布局

只尺八寸
 只尺八寸
发布于 2016/02/16 08:52
字数 88
阅读 59
收藏 1
;(function(){
	var base = 0.625/375;//基准屏宽iPhone6为准
	var setFont = function(){
		var nowWidth = document.body.clientWidth>600 ? 600 : document.body.clientWidth;
		document.querySelector('html').style.fontSize = nowWidth * base + 'rem';
	};
	setFont();
	window.onresize = setFont;
})();

这段js代码要放在body开始标签之后

© 著作权归作者所有

只尺八寸
粉丝 2
博文 20
码字总数 8239
作品 0
昌平
程序员
私信 提问
前端屏幕适配的总结

1.web app变革之rem(http://isux.tencent.com/web-app-rem.html) 2.移动前端自适应解决方案和比较(http://caibaojian.com/mobile-responsive-example.html) 3.前端开发终端适配方案(http://w......

IT追寻者
2016/08/03
195
0
rem, vw, 还是...? 各凭本事的移动端适配方案

前言 2018年最后的法定假期都已经结束了,我相信大部分正在进行或曾经进行过移动端页面开发的同学都或多或少的了解过使用rem进行移动端页面适配的方案以及使用vw的方案,(没了解过的同学可以...

PandaGao
2018/10/15
0
0
理解rem实现响应式布局原理及js动态计算rem

前言   移动端布局中,童鞋们会使用到rem作为css单位进行不同手机屏幕大小上的适配。那么来讲讲rem在其中起的作用和如何动态设置rem的值。 1、什么是rem   rem是相对于根元素(html标签)...

damon风
2017/11/22
0
0
响应式布局的常用解决方案对比(媒体查询、百分比、rem和vw/vh)

我的博客原文地址:原文地址 简要介绍:前端开发中,静态网页通常需要适应不同分辨率的设备,常用的自适应解决方案包括媒体查询、百分比、rem和vw/vh等。本文从px单位出发,分析了px在移动端...

yuxiaoliang
2018/07/02
0
0
关于移动端的适配

写在前面 本文参考了大量关于移动端适配的资料 侵删 谢谢 基础介绍 在说明移动端的适配之前我们需要理解一个重要的东西 像素!! 像素 在移动端给一个元素设置时发生了什么?这里的px到底是多...

熊蛋子17
2017/12/31
0
0

没有更多内容

加载失败,请刷新页面

加载更多

写一个线程安全的投票系统

有一个map,key存储候选人名称,value存储该候选人的得票数。请实现一个线程安全的投票系统. 为了测试并发环境下的表现,我们先设计一个小的“框架”,用来模拟并发情况下的投票行为。 首先设...

铁骨铮铮
25分钟前
1
0
今天的学习

php的类是通过关键字class来声明的,关键字后面是类名,然后是花括号,花括号里面是类的属性和方法。 类的属性和方法有四种格式,public,private,protected,finally。 意思是public(公有的...

墨冥
29分钟前
0
0
Issue和PR标签(Kubernetes社区Issue和PR标签解释)

一般标签 标签 含义 备注 good first issue 指示该issue适合由新贡献者参与 参照"help wanted"指导文档 help wanted 指示该issue需要帮助 必须满足"help wanted"指导文档 needs-kind 指示该i......

恋恋美食
今天
1
0
Array数组操作

includes() 方法用来判断一个数组是否包含一个指定的值,根据情况,如果包含则返回 true,否则返回false。 Eg:error.message.includes('timeout'); 1、indexOfindexOf()方法返回在该数组中第一...

lslaiwy
今天
2
0
运行pipenv报错UnicodeDecodeError的问题

问题:运行pipenv就报错:UnicodeDecodeError: 'utf-8' codec can't decode ...... 环境:windows10,python 3.7.1 解决:因为升级了一次3.7.3恰好有出了这问题,结果绕了很多弯路,以为是p...

编程老陆
今天
0
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部