<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
<meta name="robots" content="all">
<meta name="format-detection" content="telephone=no" />
<style type="text/css">
*{padding: 0;margin: 0;}
html,body{width:100%;height: 100%;font-family: "Microsoft YaHei"; position: relative;}
.banner{height:230px;width: 414px;background: red}
</style>
<script type="text/javascript"> //var num=$(window).width();
var num= window.innerWidth;
var font=num/10;
document.getElementsByTagName('html')[0].style.fontSize=font+'px'
//$('html').css('font-size',font+'px');
/* window.onresize=function(){
num=$(window).width();
font=num/10;
$('html').css('font-size',font+'px');
} */
</script>
<title>平台</title>
</head>
<body>
<div class="banner">
</div>
<script type="text/javascript">
var html=$('html').html();
var remhtml=html.replace(/(\d+)px/g, function(a,b){
console.log(b)
var num=b/41.4+"";
console.log(num)
return num.substring(0, 5)+"rem";
})
console.log(remhtml);
</script>
</body>
</html>

  

长度rem的使用的更多相关文章

  1. 通过SVN获取变更列表,得到对应的最新class

    通过本地SVN获得未提交的文件列表获取工程中最新的class的方式参考: 增量部署代码利用批处理命令按原始结构复制指定的文件 新写了一个增强版,根据已提交至SVN的代码loglist,获取最新的cla ...

  2. Sublime 插件- px 转rem

    一个CSS的px值转rem值的Sublime Text 3自动完成插件. 插件效果如下: 安装 克隆项目   https://github.com/hyb628/cssrem.git 进入packag ...

  3. 用rem实现WebApp自适应的优劣分析

    关于rem实现屏幕自适应布局的讨论还是比较多的,刚好我也看到使用rem实现自适应的web app,所以也来凑下热闹. 说起rem,免不了要联系到em.px,这里简单提提他们的定义和特点. 1. px: ...

  4. 好用的px转rem的插件

    一个CSS的px值转rem值的Sublime Text 3自动完成插件. 下载地址: https://github.com/flashlizi/cssrem 安装 下载本项目,比如:git clone ...

  5. 了解真实的『REM』手机屏幕适配

    rem 作为一个低调的长度单位,由于手机端网页的兴起,在屏幕适配中得到重用.使用 rem 前端开发者可以很方便的在各种屏幕尺寸下,通过等比缩放的方式达到设计图要求的效果. rem 的官方定义『The ...

  6. 深度讲解VIEWPORT和PX是什么?移动端单位px,em,rem

    刚开始接触移动页面重构,是不是很迷惑应该按照多大的尺寸制作?320.640还是720?按照640的设计稿重构完页面,是不是还需要写其他尺寸来适配不同的屏幕大小?—— 这源于对viewport和px的不 ...

  7. css之px自动转rem—“懒人”必备

    作为一名前端开发,尤其是在做移动端适配时,rem是我们经常用到的单位,它的好处大家可以自行搜索,网上已经有很多了.但是我们再将设计稿上的px转换成rem时,得手动的去计算,这是一个很耗时.费力的过程, ...

  8. css中的px、em、rem 详解

    概念介绍: 1.px (pixel,像素):是一个虚拟长度单位,是计算机系统的数字化图像长度单位,如果px要换算成物理长度,需要指定精度DPI(Dots Per Inch,每英寸像素数),在扫描打印时 ...

  9. px,pt,em,rem

    一直对px,pt,em,rem的认识有误区,现整理一下,供参考.之后还得整理下关于dpi相关的知识. px(pixe,像素l):是一个虚拟长度单位,是计算机系统的数字化图像长度单位,如果px要换算成物 ...

随机推荐

  1. 学习JavaScript你必须掌握的8大知识点!

    大知识点! 一.JavaScript思维导图之<变量>的学习 二.    JavaScript思维导图之<函数基础>  三.JavaScript思维导图之<基本dom操作 ...

  2. Js笔记-第11课

    // 第11课         作用域精解     运行期上下文,当函数执行时,会创建一个成为执行期上下文的内部对象.一个执行期上下文定义了一个函数执行时的环境,函数每次执行时对应的执行期上下文都是独 ...

  3. python面向对象之抽象工厂设计模式

    class truck: def use(self): return "拉货" def __str__(self): return "大卡车" class mi ...

  4. (73)zabbix用户认证方式 内建、HTTP Basic、LDAP

    公司大大小小众多系统,不同系统不同的账号密码,管理上相当复杂,后来慢慢出现了SSO等账号统一验证,其他zabbix也提供了类似的方法,或许有些公司便可以使用公司提供的账号来登录zabbix了. zab ...

  5. 201621123080《Java程序设计》第12周学习总结

    201621123080<Java程序设计>第12周学习总结 1. 本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结多流与文件相关内容. 2. 面向系统综合设计-图书馆管理系 ...

  6. hashable与unhashable

    不可哈希(unhashable):就是指其可变,如列表.字典等,都能原地进行修改. 可哈希(hashable):不可变,如字符串.元组那样,不能原地修改. 利用set()和{}建立集合时,要求集合中的 ...

  7. python数据类型之集合(set)和其常用方法

    集合是一个无序的,不重复的数据组合 作用(集合的重点):1.去重,把一个列表变成集合就自动去重了2.关系测试,测试两组数据库之前的交集.差集.并集等关系 s = {1, 1, 2, 2, 3, 4, ...

  8. LeetCode(44) Wildcard Matching

    题目 Implement wildcard pattern matching with support for '?' and '*'. '?' Matches any single characte ...

  9. selenuim2模拟鼠标键盘操作

    有时候有些元素不便点击或者做其他的操作,这个时候可以借助selenium提供的Actions类,它可以模拟鼠标和键盘的一些操作,比如点击鼠标右键,左键,移动鼠标等操作.对于这些操作,使用perform ...

  10. 安装go 1.5 & 部署

    https://storage.googleapis.com/golang/go1.5.linux-amd64.tar.gz tar -C /usr/local -xzf go1.5.linux-am ...