// rem尺寸转换函数开始
(function (doc, win) {

    var docEl = doc.documentElement,
        resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
        recalc = function () {
            var clientWidth = docEl.clientWidth;
            if (!clientWidth) return;
            if(clientWidth>=640){
                docEl.style.fontSize = '100px';
            }else{
                docEl.style.fontSize = 100 * (clientWidth / 640) + 'px';
            }
        };
    if (!doc.addEventListener) return;
    win.addEventListener(resizeEvt, recalc, false);
    doc.addEventListener('DOMContentLoaded', recalc, false);
})(document, window);
// rem尺寸转换函数接受

像素与rem转换的更多相关文章

  1. 微信小程序开发-rem转换rpx小工具

    实现原理: 对样式进行格式化,然后根据 “rem” 进行拆分,这样就会拆分成一个数组 [str1,str2,str3...,str6], 除了最后一个元素,前边的元素都会以 “rem” 样式的数值结尾 ...

  2. 字体的大小(pt)和像素(px)如何转换?

    px:相对长度单位.像素(Pixel). pt:绝对长度单位.点(Point). 1in = 2.54cm = 25.4 mm = 72pt = 6pc 具体换算是: Points Pixels Em ...

  3. vue2.0 类淘宝不同屏幕适配及px与rem转换问题

    因为项目需要,vue开发项目,必须将已写的以px为单位的部分,转换为rem.要是全部转换,这大量的计算量,哪怕是sublime Text 的cssrem插件,也是一个庞大的工作量.所以,直接使用插件没 ...

  4. vue 项目中px转rem转换问题(postcss-px2rem)

    1.安装postcss-px2rem npm install postcss-px2rem --save npm install postcss-px2rem --save 2.配置px2rem 在配 ...

  5. android开发之dip,dp与px像素之间的转换工具,可能用的不多,但是有总比没有好吧。

    作者:程序员小冰,CSDN博客:http://blog.csdn.net/qq_21376985,转载请说明出处. 下面是介绍: 免积分下载地址:http://download.csdn.net/de ...

  6. Rem与Px的转换[转载]

    原文:http://www.w3cplus.com/preprocessor/sass-px-to-rem-with-mixin-and-function.html rem是CSS3中新增加的一个单位 ...

  7. iOS关于图片点到像素转换之杂谈

    大熊猫猪·侯佩原创或翻译作品.欢迎转载,转载请注明出处. 如果觉得写的不好请多提意见,如果觉得不错请多多支持点赞.谢谢! hopy ;) 不管是以什么方法生成的图片,是从磁盘上读取的,还是从其他对象中 ...

  8. FFmpeg(10)-利用FFmpeg进行视频像素格式和尺寸的转换(sws_getCachedContext(), sws_scale())

    一.包含头文件和库文件 像素格式的相关函数包含在 libswscale.so 库中,CMakeLists需要做下列改动: # swscale add_library(swscale SHARED IM ...

  9. Sass基础——Rem与Px的转换

    rem是CSS3中新增加的一个单位值,他和em单位一样,都是一个相对单位.不同的是em是相对于元素的父元素的font-size进行计算:rem是相对于根元素html的font-size进行计算.这样一 ...

随机推荐

  1. iOS 之APP上架

    前几天在忙着上线,尽管之前已经上线过一次,但由于本身比较菜,还是状况百出. 好在今天终于成功提交,因此来写写心得. 如果是第一次上线,推荐这篇文章: http://jingyan.baidu.com/ ...

  2. 在不动用sp_configure的情况下,如何 =》去掉列的自增长,并保留原数据

    异常处理汇总-数据库系列  http://www.cnblogs.com/dunitian/p/4522990.html 后期博客首发:http://dnt.dkill.net/Article/Det ...

  3. JAVA的静态变量、静态方法、静态类

    静态变量和静态方法都属于静态对象,它与非静态对象的差别需要做个说明. (1)Java静态对象和非静态对象有什么区别? 比对如下: 静态对象                                ...

  4. VS2013中web项目中自动生成的ASP.NET Identity代码思考

    vs2013没有再分webform.mvc.api项目,使用vs2013创建一个web项目模板选MVC,身份验证选个人用户账户.项目会生成ASP.NET Identity的一些代码.这些代码主要在Ac ...

  5. 实践 Neutron 前的两个准备工作 - 每天5分钟玩转 OpenStack(78)

    上一节配置了 linux-bridge mechanism driver,本节再做两个准备工作: 1. 检视初始的网络状态.2. 了解 linux bridge 环境中的各种网络设备. 初始网络状态 ...

  6. 关于SubSonic3.0未处理InvalidOperationException异常(关键字TOP附近有语法错误)的处理

    早上在测试程序时,使用了Top这个属性,没想到马上抛出了个“未处理InvalidOperationException异常(关键字'TOP'附近有语法错误)”这个错误提示,见下图: 然后Debug一下, ...

  7. 使用ikmv将jar转换为dll,在.NET中直接调用

    ikmv百科介绍 ikvm官网 使用ikvm前需要先安装java. ikvm的使用比较简单,到官网下载ikvm需要的组件,解压后在path中配置 %IKVM_HOME%\bin 在cmd中使用命令 i ...

  8. ES6 - Note5:Promise

    1.Promise介绍 Promise最早是社区提出和实现,后面ES6将其写入标准,并原生提供Promise对象,是一种异步编程的解决方案,具体的概念大家可以去查看相关的资料.传统上处理异步都是以ca ...

  9. MySQL中有关TIMESTAMP和DATETIME的总结

    一.MySQL中如何表示当前时间? 其实,表达方式还是蛮多的,汇总如下: CURRENT_TIMESTAMP CURRENT_TIMESTAMP() NOW() LOCALTIME LOCALTIME ...

  10. 附录E 安装Kafka

    E.1   安装Kafka E.1.1    下载Kafka Kafka是由LinkedIn设计的一个高吞吐量.分布式.基于发布订阅模式的消息系统,使用Scala编写,它以可水平扩展.可靠性.异步通信 ...