REM布局计算,移动端,pc端有兼容性)
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端有兼容性)的更多相关文章
- 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端和手机端抓包的 ...
- rem布局计算(移动端,pc端有兼容性)
1 <!DOCTYPE html> 2 <html> 3 <head lang="en"> 4 <script> 5 functio ...
- 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 ...
随机推荐
- Android开发 MediaRecorder使用Camera2配合录制视频(暂时有异常抛出,无法使用)
前言 这个博客本来是用来详细介绍MediaRecorder与Camera2,但是出乎预料之外,在获取mMediaRecorder.getSurface();的时候无论如何都是报错的,报错为Surfac ...
- java.net.UnknownHostException 异常处理(转)
在linux系统下部署Java产品的集群环境时,后台报出如下异常,系统报找不到名为“QATest242”的主机: ERROR - Get local host name failed -com.tr ...
- hp笔记本在设置VT-x为启用模式后还是无法在VMware上开启CentOS虚拟机
在h笔记本上,将VT-x设置为Enabled模式后,需要断开电源,拆下电池,然后再按住开机按钮10秒钟左右放开,再重新装上电池,接通电源即可.
- LUOGUP3498 [POI2010]KOR-Beads (哈希)
传送门 解题思路 这是一道上周的考试题...当时考的时候看了一眼,"呀,这不是调和级数,nlogn么!!!" ,然后一写就写了个n^2的....结果边界还弄错40分滚蛋了..正解就 ...
- VC操作Excel之基本操作(颜色等)【转载】
文章出处https://blog.csdn.net/form88/article/details/78566390 EXCEL里如何知道某种颜色的ColorIndex的值 ===fag::====== ...
- input 的 placeholder 样式修改
input::-webkit-input-placeholder{ color:#999999; } input::-moz-placeholder{ /* Mozilla Firefox 19+ * ...
- VS2010-MFC(利用MFC向导生成单文档应用程序框架)
一.VC++与MFC 讲VC++免不了要提MFC,MFC全称Microsoft Foundation Classes,也就是微软基础类库.它是VC++的核心,是C++与Windows API的结合,很 ...
- yii2下使用支付宝
最近入坑了yii2 感觉是个很强大的框架.使用yii做支付宝的移动支付的时候出了点问题,记录下来避免以后忘记了. 使用的是支付宝立即到账的功能,网上很多集成好的接口我就不重复了,找不到的话github ...
- linux服务器之间传输文件
转载:https://www.jb51.net/article/82608.htm 1. scp(最近就使用了scp) [优点]简单方便,安全可靠:支持限速参数 [缺点]不支持排除目录[用法]scp就 ...
- 在AlexNet中LRN 局部响应归一化的理
在AlexNet中LRN 局部响应归一化的理 一.LRN技术介绍: Local Response Normalization(LRN)技术主要是深度学习训练时的一种提高准确度的技术方法.其中caffe ...