rem布局计算（移动端，pc端有兼容性）
1 <!DOCTYPE html>
2 <html>
3 <head lang="en">
4 <script>
5 function rootREM() {
6 var W = document.documentElement.clientWidth;
7 W = (W <= 640) ? W : 640;
8 document.documentElement.style.fontSize = W / 10 + 'px';
9 document.body.style.fontSize = W / 20 + 'px';
10 }
11 window.onresize = function () {
12 rootREM()
13 };
14 </script>
15 <meta charset="UTF-8">
16 <title></title>
17 <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1">
18 </head>
19 <body onload="rootREM()">
20
21 <div style="max-width: 640px;">
22 <br/>你好，世界！
23 <br/>你好，世界！
24 <br/>你好，世界！
25 <br/>你好，世界！
26 <br/>你好，世界！
27 <br/>你好，世界！
28 <br/>你好，世界！
29 <br/>你好，世界！
30 <br/>你好，世界！
31 <br/>你好，世界！
32 <br/>你好，世界！
33 <br/>你好，世界！
34 <br/>你好，世界！
35 <br/>你好，世界！
36 <br/>你好，世界！
37 <br/>你好，世界！
38 <br/>你好，世界！
39 <br/>你好，世界！
40 <br/>你好，世界！
41 <br/>你好，世界！
42 <br/>你好，世界！
43 <br/>你好，世界！
44 <br/>你好，世界！
45
46 </div>
47
48 </body>
49 </html>
rem布局计算（移动端，pc端有兼容性）的更多相关文章
- REM布局计算,移动端,pc端有兼容性）
rem布局计算(移动端,pc端有兼容性) <!DOCTYPE html> <html> <head lang="en"> <script& ...
- js 设备判断（移动端pc端 安卓ios 微信）
苹果安卓判断 $(function () { var u = navigator.userAgent, app = navigator.appVersion; var isAndroid = u.in ...
- 移动端&PC端CSS样式兼容代码
CSS样式兼容代码 1.禁止选中复制文本 *{ user-select: none; -moz-user-select: none; -ms-user-select: none; -webkit-us ...
- js -- 移动端pc端自动切换
1. 判断浏览器类型 浏览器判断使用的github开源项目current-device,下面是地址: https://github.com/matthewhudson/current-device 在 ...
- Charles如何抓取https请求-移动端+PC端
Charles安装完成,默认只能抓取到http请求,如果查看https请求,会显示unkonw或其它之类的响应.所以需要先进行一些配置,才能抓取到完整的https请求信息.下面针对PC端和手机端抓包的 ...
- React.js 入门与实战之开发适配PC端及移动端新闻头条平台课程上线了
原文发表于我的技术博客 我在慕课网的「React.js 入门与实战之开发适配PC端及移动端新闻头条平台」课程已经上线了,文章中是目前整个课程的大纲,以后此课程还会保持持续更新,此大纲文档也会保持更新, ...
- 在前端眼中pc端和移动的开发区别
按照昨天所说,本包子今天将总结在前端开发中,pc端和移动端的区别,整理完这些区别,本包子将开始整理pc端的布局,会写实际的代码了,还是那句话,希望文章中有什么不足的地方,大家能多多指正,大家一起进步, ...
- 判断pc端还是移动，并给移动加上其它的样式文件方法
所有移动端PC端 按 640 进行排版 body, html { width: %; height: %; overflow: hidden; background-color: #; } bod ...
- JS判断android ios系统 PC端和移动端
最近公司上线移动端,需要根据不同的系统跳转到不同的产品页面,百度后发现这一段代码很好用,不但可以判断当前是什么系统,还能知道当前浏览器是什么内核,移动端PC端都已测试无问题! var browser ...
随机推荐
- 轻量级桌面 openbox + tint2 + conky + stalonetray + pcmanfm + xcompmgr
openbox+tint2+pnmixer+conky=轻量级archlinux桌面环境设置备忘 缘起 机器上的Ubuntu 12.04有一段时间没有使用了,最近在用的时候发现频繁死机的情况,开始以为 ...
- Swift3 - compare方法之ComparisonResult说明
Swift3在实现两个对象比较时,引入了compare方法,其中,方法返回值ComparisonResult解释如下: ComparisonResult是一个枚举类型,包含了以下3个成员: 其中: q ...
- 我的第一个Raspberry PI装置
好吧,我先承认是这是从书上学习的第一个示例. 我入手的是Raspberry红版,版本2,看到这么小巧的卡片电脑可以做这么多事情,真是让人惊喜! 安装系统等都很顺利,启动.安装程序.远程桌面.SSH登录 ...
- java struts2入门学习---国际化
一.国际化的概念 1.不同国家的人访问同一个网站,显示的语言不同. 2.对JSP页面进行国际化 属性(properties)文件命名规则:基名---语言--国家如, message_zh_CN.pro ...
- mysql--SQL编程(关于mysql中的日期) 学习笔记2
一.mysql数据库中的date1.DATETIME和DATE:DATETIME占用8个字节,日期范围为"1000-01-01 00:00:00"到"9999-12-31 ...
- iOS绘图UIBezierPath 和 Core Graphics框架
前言 iOS系统本身提供了两套绘图的框架,即UIBezierPath 和 Core Graphics.而前者所属UIKit,其实是对Core Graphics框架关于path的进一步封装,所以使用起来 ...
- fwrite()的返回值随着格式的不同返回值也不同；
常用地函数fwrite fwrite()的返回值随着格式的不同返回值也不同: 也是最近涉及到代码才注意到的,汗!!! 转载了一篇文章来说明这个问题:文章地址:http://blog.csdn.net/ ...
- 【Spring】SpringMVC之异常处理
java中的异常分为两类,一种是运行时异常,一种是非运行时异常.在JavaSE中,运行时异常都是通过try{}catch{}捕获的,这种只能捕获显示的异常,通常项目上抛出的异常都是不可预见.那么我们能 ...
- class-dump在osx 10.11以后安装方法
当Mac升级了OSX 10.11后,配置class-dump的时候,会发现逆向书上推荐的class-dump存放目录/usr/bin,class-dump存放不进去,尝试过用sudo 还是不被允许 ...
- Idea集成Lombok代码注释来精简代码
转载http://www.cnblogs.com/holten/p/5729226.html Lombok介绍及使用方法 lombok简介 lombok是暑假来到公司实习的时候发现的一个非常好用的小工 ...