rem布局计算(移动端,pc端有兼容性)

 <!DOCTYPE html>
 <html>
 <head lang="en">
     <script>
         function rootREM() {
             var W = document.documentElement.clientWidth;
             W = (W <= 640) ? W : 640;
             document.documentElement.style.fontSize = W / 10 + 'px';
             document.body.style.fontSize = W / 20 + 'px';
         }
         window.onresize = function () {
             rootREM()
         };
     </script>
     <meta charset="UTF-8">
     <title></title>
     <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1">
 </head>
 <body onload="rootREM()">

 <div style="max-width: 640px;">
     <br/>你好,世界!
     <br/>你好,世界!
     <br/>你好,世界!
     <br/>你好,世界!
     <br/>你好,世界!
     <br/>你好,世界!
     <br/>你好,世界!
     <br/>你好,世界!
     <br/>你好,世界!
     <br/>你好,世界!
     <br/>你好,世界!
     <br/>你好,世界!
     <br/>你好,世界!
     <br/>你好,世界!
     <br/>你好,世界!
     <br/>你好,世界!
     <br/>你好,世界!
     <br/>你好,世界!
     <br/>你好,世界!
     <br/>你好,世界!
     <br/>你好,世界!
     <br/>你好,世界!
     <br/>你好,世界!

 </div>

 </body>
 </html>

REM布局计算,移动端,pc端有兼容性)的更多相关文章

  1. js 设备判断(移动端pc端 安卓ios 微信)

    苹果安卓判断 $(function () { var u = navigator.userAgent, app = navigator.appVersion; var isAndroid = u.in ...

  2. 移动端&PC端CSS样式兼容代码

    CSS样式兼容代码 1.禁止选中复制文本 *{ user-select: none; -moz-user-select: none; -ms-user-select: none; -webkit-us ...

  3. js -- 移动端pc端自动切换

    1. 判断浏览器类型 浏览器判断使用的github开源项目current-device,下面是地址: https://github.com/matthewhudson/current-device 在 ...

  4. Charles如何抓取https请求-移动端+PC端

    Charles安装完成,默认只能抓取到http请求,如果查看https请求,会显示unkonw或其它之类的响应.所以需要先进行一些配置,才能抓取到完整的https请求信息.下面针对PC端和手机端抓包的 ...

  5. rem布局计算(移动端,pc端有兼容性)

    1 <!DOCTYPE html> 2 <html> 3 <head lang="en"> 4 <script> 5 functio ...

  6. React.js 入门与实战之开发适配PC端及移动端新闻头条平台课程上线了

    原文发表于我的技术博客 我在慕课网的「React.js 入门与实战之开发适配PC端及移动端新闻头条平台」课程已经上线了,文章中是目前整个课程的大纲,以后此课程还会保持持续更新,此大纲文档也会保持更新, ...

  7. 在前端眼中pc端和移动的开发区别

    按照昨天所说,本包子今天将总结在前端开发中,pc端和移动端的区别,整理完这些区别,本包子将开始整理pc端的布局,会写实际的代码了,还是那句话,希望文章中有什么不足的地方,大家能多多指正,大家一起进步, ...

  8. 判断pc端还是移动,并给移动加上其它的样式文件方法

      所有移动端PC端 按 640 进行排版 body, html { width: %; height: %; overflow: hidden; background-color: #; } bod ...

  9. JS判断android ios系统 PC端和移动端

    最近公司上线移动端,需要根据不同的系统跳转到不同的产品页面,百度后发现这一段代码很好用,不但可以判断当前是什么系统,还能知道当前浏览器是什么内核,移动端PC端都已测试无问题! var browser ...

随机推荐

  1. 19-11-1-N

    就剩一个键了…… 以后怎么办呢? 也许可以试试字符映射表……(滑稽 ZJ一下: 我还以为我要死了…… 40 Miemeng 10 03:21:50 80 03:21:51 10 03:21:51 10 ...

  2. Unity优化垃圾回收GC

  3. 使用flags定义命令行参数

    TensorFlow定义了tf.app.flags,用于支持接受命令行传递参数,其中tf.app.flags.DEFINE_xxx()是添加命令行的optional argument(可选参数),而t ...

  4. ucore 地址映射的几个阶段

    第零阶段: 启动之后的实模式阶段 vir = lin = pa 第一阶段 : 启动 bootloader 的段式分页 这里段基址是0 ,所以地址空间维持不变 vir addr = lin addr = ...

  5. vue 全局过滤器(单个和多个过滤器)

    参考: https://www.cnblogs.com/liujn0829/p/8622960.htmlhttps://blog.csdn.net/z8735058/article/details/7 ...

  6. window环境下Python+OpenCV配置

    最近开始学习OpenCV来进行计算机视觉实验,选择了Python作为实验语言,工欲善其事,必先利其器.先总结下安装配置. 现在opencv目测只支持Python2.7X版本的,还依赖于numpy和ma ...

  7. idea查看jar冲突和解决方法

    选中Dependencies,点上边那个按钮,出现下图 依赖图太小了,根本没法看啊?好办,点击鼠标右键,呼出右键菜单栏,然后点击Actual Size: 如果我们仔细观察上图,会发现在项目依赖图中,有 ...

  8. Mkdir- Linux必学的60个命令

    1.作用 mkdir命令的作用是建立名称为dirname的子目录,与MS DOS下的md命令类似,它的使用权限是所有用户. 2.格式 mkdir [options] 目录名 3.[options]主要 ...

  9. Vuex持久化存储之vuex-persist

    在引入mapMutations时报错,解决方法: 1:npm install --save-dev babel-plugin-transform-object-rest-spread 2:在packa ...

  10. innodb状态

    Innodb_buffer_pool_pages_data Innodb buffer pool缓存池中包含数据的页的数目,包括脏页.单位是page. Innodb_buffer_pool_pages ...