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 ...
随机推荐
- Qt : 隐式数据共享(copy on write)
copy on write 意思当内容有变动的时候,才对容器中的数据结构进行复制.否则仅作共享. QT许多类中使用了隐式数据共享技术,来最大化资源利用率和最小化拷贝时的资源消耗. 在数据传递时,其实只 ...
- 廖雪峰Java14Java操作XML和JSON-2JSON-2处理JSON
解析JSON JSR 353 API 常用的第三方库 * Jackson * gson * fastjson Jackson: 提供了读写JSON的API JSON和JavaBean可以互相转换 可食 ...
- token 与 基于JWT的Token认证
支持跨域访问,无状态认证 token特点 支持跨域访问: Cookie是不允许垮域访问的,这一点对Token机制是不存在的,前提是传输的用户认证信息通过HTTP头传输 无状态(也称:服务端可扩展行): ...
- Python3基础笔记_迭代器
# Python3 迭代器与生成器 import sys ''' 迭代是Python最强大的功能之一,是访问集合元素的一种方式. 迭代器是一个可以记住遍历的位置的对象. 迭代器对象从集合的第一个元素开 ...
- javascript 数组的方法(一)
栈方法(后进先出) ArrayObj.push():就是向数组末尾添加新的元素,返回的是数组新的长度. ArrayObj.pop():就是向数组中删除数组最后一个元素并且返回该元素.如果数组为空就返回 ...
- 洛谷P2890 [USACO07OPEN]便宜的回文Cheapest Palindrome
题目链接: 点我 题目分析: 玄学\(dp\) 设\(val[s[i] - 'a' + 1]\)表示字母\(s[i]\)的花费 首先发现对于一个已经回文了的串\(s[i, j]\),在\(s[i - ...
- win7+64位笔记本安装TensorFlow CPU版
最近要用到Keras框架,而Keras是基于Theano或Tensorflow框架安装的,所以首先要准备底层框架的搭建. 在网上看了一大堆教程头昏脑涨,随便挑了个试一试,竟然捣鼓成功了,记录一下安装过 ...
- centos7中给Elasticsearch5 安装bigdesk
系统:centos7 elasticsearch:5.2.2 安装步骤 步骤 由于elasticsearch不再建议支持插件的安装方式.建议作为独立的程序来安装类似于bigdesk.head. 以前都 ...
- 微信小程序 拼团商品倒计时(拼团列表、拼团商品详情)
直接上图: 拼团列表.拼团详情-倒计时 //单个倒计时,适用用于单个商品的倒计时 js文件: //倒计时 function cou ...
- 第二周——1.项目中MySQL版本问题
1.版本升级 经组长推荐,本地安装的是mysql-8.0.11,而主项目用的还是版本5.6, 因此需要升级版本. 首先,更新驱动:下载mysql-connector-java-8.0.11,将E:\P ...