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 ...
随机推荐
- spring中依赖注入
理解依赖注入:参考https://blog.csdn.net/taijianyu/article/details/2338311 一.依赖注入让bean与bean之间以配置文件组织在一起,而不是以硬编 ...
- WPF 先显示登录成功,验证成功后显示主窗口
/// 设置显示登录窗口的方法: /// 在 App.xaml 中把这句 /// 删掉 StartupUri="MainWindow.xaml" 改为 StartupUri=&qu ...
- Python全栈开发:基本数据类型
1.数字 int(整型) 在32位机器上,整数的位数为32位,取值范围为-2**31-2**31-1,即-2147483648-2147483647 在64位系统上,整数的位数为64位,取值范围为-2 ...
- BZOJ1912:[APIO2010]patrol巡逻
Description Input 第一行包含两个整数 n, K(1 ≤ K ≤ 2).接下来 n – 1行,每行两个整数 a, b, 表示村庄a与b之间有一条道路(1 ≤ a, b ≤ n). Ou ...
- linux ssh密钥认证, 免密码登陆
1. 客户端生成密钥 # mkdir ~/.ssh # chmod ~/.ssh # cd ~/.ssh 生成RSA密钥 # ssh-keygen -t rsa (然后连续三次回车) 2. 把公钥传到 ...
- Linux 启动出现 busybox vx.x.xx built-in shell 的问题
可能是磁盘检测错误,尤其出现在未安全关机或者磁盘损坏之后. 解决办法: 1.在选择启动项目时,选中第一项,如: ubuntu 8.04kernl.2.6.22-16-generic 2.按E 进入编辑 ...
- 使用R进行数据提取
使用R进行数据提取 数据提取是数据分析日常工作中遇到最多的需求,本篇文章介绍如何通过R按特定的维度或条件对数据进行提取,完成数据提取需求. 读取并创建数据表 首先第一步是读取数据,并创建名称为loan ...
- 基于SpringBoot的开源微信开发平台,Jeewx-Boot 1.0 版本发布
项目介绍 JeewxBoot 是一款基于SpringBoot的免费微信开发平台.支持微信公众号.小程序官网.微信抽奖活动. Jeewx-Boot实现了微信公众号管理.小程序CMS.微信抽奖活动等基础功 ...
- 版本控制git之四-忽略特殊文件
版本控制git之四-忽略特殊文件 有些时候,你必须把某些文件放到Git工作目录中,但又不能提交它们,比如保存了数据库密码的配置文件啦,等等,每次git status都会显示Untracked fi ...
- Python学习day16-模块基础
<!doctype html>day16 - 博客 figure:last-child { margin-bottom: 0.5rem; } #write ol, #write ul { ...