移动端自适应布局之-----rem单位的使用
2018-02-08 20:48
465 查看
rem布局非常简单,首页你只需在页面引入这段原生js代码就可以了
(function (doc, win) { var docEl = doc.documentElement, resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize', recalc = function () { var clientWidth = docEl.clientWidth; if (!clientWidth) return; if(clientWidth>=640){ docEl.style.fontSize = '100px'; }else{ docEl.style.fontSize = 100 * (clientWidth / 640) + 'px'; } }; if (!doc.addEventListener) return; win.addEventListener(resizeEvt, recalc, false); doc.addEventListener('DOMContentLoaded', recalc, false); })(document, window);
相关文章推荐
- 关于使用rem单位,calc()进行自适应布局
- 关于使用rem单位,calc()进行自适应布局
- web移动端CSS使用rem单位设置font-size自适应
- 使用rem单位实现布局自适应
- 关于使用rem单位,calc()进行自适应布局
- `移动端布局``rem单位使用``flexible适配``gulp中的sass插件和bowsersync的使用
- 关于使用rem单位、css函数calc()进行自适应布局
- rem 自适应布局 bootstrap 移动端适配
- 移动端rem自适应布局(切图)
- 使用rem设计移动端自适应页面二(转载)
- 超好用的移动端布局自适应大小rem判断js文件及超过一定高度回到顶部按钮代码
- rem自适应布局-移动端自适应必备:flexible.js
- html rem布局,在移动端超级好用,自适应效果非常好!
- 使用rem设计移动端自适应页面三(转载)
- rem布局--移动端页面自适应解决方案
- 移动端的自适应rem布局
- 移动端的自适应rem布局
- 【移动端】页面自适应布局—基于rem布局
- 谈谈利用JavaScript结合相对单位rem实现自适应布局的简单而实用的方法
- 移动端初设置(使用rem作为单位)