最近我在开发的过程中,出现了一个需求,我需要把开发好的小程序倒模成H5页面,这里就涉及一个布局单位问题,我们小程序用的单位都rpx,是按照750rpx铺满整个页面来算的,可H5又不支持rpx单位,这里在倒模页面的时候就碰到了一个问题严重的问题,我总不可能一个一个去算吧(真的太烦了),这里我给大家介绍一个取巧的方法,H5的页面单位中有rem单位,是根据html的文字大小来调整的,那么我们只需要计算出1rpx等于多少vw就可以了。

代码如下:

html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video {
margin:0;
padding:0;
border:0;
}
img{
width:100%;
height: 100%;
} html {
font-size: 0.13333vw;
}

  

当html的文字大小等于0.13333vw的时候,我们可以把css全部粘贴过去,一键把rpx换成rem就可以了,如果对你有所帮助,请给我点个推荐。

如何将1rpx转为1rem的更多相关文章

  1. 使用gulp将移动端px转为rem

    使用gulp的插件可以很方便的将xp转为rem,在布局的时候使用@1x .@2x布局,即10rem=device-width:@1x即设计图为320px,1rem对应的10px像素,相对的@2x即为布 ...

  2. js 移动端 多图上传 预览 删除 base64转为url 传给后端

    说下主要的逻辑,首先是利用input type="file",上传文件,然后判断文件类型是否是图片,这里要注意(multiple,安卓一次一张,ios可以多张). 接着把本地图片转 ...

  3. Windows server 2012 添加中文语言包(英文转为中文)(离线)

    Windows server 2012 添加中文语言包(英文转为中文)(离线) 相关资料: 公司环境:亚马孙aws虚拟机 英文版Windows2012 中文SQL Server2012安装包,需要安装 ...

  4. [LeetCode] Convert a Number to Hexadecimal 数字转为十六进制

    Given an integer, write an algorithm to convert it to hexadecimal. For negative integer, two’s compl ...

  5. [LeetCode] Integer to English Words 整数转为英文单词

    Convert a non-negative integer to its english words representation. Given input is guaranteed to be ...

  6. [LeetCode] Convert Sorted List to Binary Search Tree 将有序链表转为二叉搜索树

    Given a singly linked list where elements are sorted in ascending order, convert it to a height bala ...

  7. [LeetCode] Convert Sorted Array to Binary Search Tree 将有序数组转为二叉搜索树

    Given an array where elements are sorted in ascending order, convert it to a height balanced BST. 这道 ...

  8. [LeetCode] String to Integer (atoi) 字符串转为整数

    Implement atoi to convert a string to an integer. Hint: Carefully consider all possible input cases. ...

  9. 在.NET中把项目从类库转为Web应用程序

    我们知道,在.NET中所有的项目文件以.csproj为扩展名.内容是xml格式. 类库项目文件.csproj: <Project DefaultTargets="Build" ...

随机推荐

  1. Web服务器-并发服务器-协程 (3.4.2)

    @ 目录 1.分析 2.代码 关于作者 1.分析 随着网站的用户量越来愈多,通过多进程多线程的会力不从心 使用协程可以缓解这一问题 只要使用gevent实现 2.代码 from socket impo ...

  2. vue-style-loader源码初步分析

    背景: 首先声明一下,我只是个菜鸡,为了解决问题才去看的源码,解决完问题之后也就没有兴趣看其他部分代码了,所以这篇文章是一次很低层次的解读,角度也相当片面,想必会有很多喷点吧. 事情的经过是这样,今年 ...

  3. [LeetCode]实现数学计算

    乘方 思路是:pow(x,n) = pow(x,n/2)*pow(x,n-n/2) 递归实现 public double myPow(double x, int n) { if (n==0) retu ...

  4. [LeetCode]652. Find Duplicate Subtrees找到重复树

    核心思想是:序列化树 序列化后,用String可以唯一的代表一棵树,其实就是前序遍历改造一下(空节点用符号表示): 一边序列化,一边用哈希表记录有没有重复的,如果有就添加,注意不能重复添加. 重点就是 ...

  5. 什么是Service Mesh

    摘自https://zhuanlan.zhihu.com/p/61901608 Service Mesh作为下一代微服务技术的代名词,初出茅庐却深得人心一鸣惊人,大有一统微服务时代的趋势. 那么到底什 ...

  6. JVM调试说明

    -XX:+<option>:表示开启option选项 -XX:-<option>:表示关闭option选项 -XX:<option>=<value>:表 ...

  7. reactor模式前序:传统IO的WEB服务器设计

    先看一段经典的WEB JAVA服务器设计 JAVA代码为(伪代码) 1 ServerSocket serverSocket = ...; 2 serverSocket.bind(8899); 3 4 ...

  8. Spring Cloud Hystrix原理篇(十一)

    一.Hystrix处理流程 Hystrix流程图如下: Hystrix整个工作流如下: 构造一个 HystrixCommand或HystrixObservableCommand对象,用于封装请求,并在 ...

  9. 使用 SOS 对 Linux 中运行的 .NET Core 进行问题诊断

    目录 说明 准备一个方便的学习环境 2.x 配置内容 3.x 配置内容 工具介绍 lldb sos plugin 1. attach 到进程上进行调试 2. 分析core dump文件 SOS 案例分 ...

  10. 死磕以太坊源码分析之MPT树-上

    死磕以太坊源码分析之MPT树-上 前缀树Trie 前缀树(又称字典树),通常来说,一个前缀树是用来存储字符串的.前缀树的每一个节点代表一个字符串(前缀).每一个节点会有多个子节点,通往不同子节点的路径 ...