如何将1rpx转为1rem
最近我在开发的过程中,出现了一个需求,我需要把开发好的小程序倒模成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的更多相关文章
- 使用gulp将移动端px转为rem
使用gulp的插件可以很方便的将xp转为rem,在布局的时候使用@1x .@2x布局,即10rem=device-width:@1x即设计图为320px,1rem对应的10px像素,相对的@2x即为布 ...
- js 移动端 多图上传 预览 删除 base64转为url 传给后端
说下主要的逻辑,首先是利用input type="file",上传文件,然后判断文件类型是否是图片,这里要注意(multiple,安卓一次一张,ios可以多张). 接着把本地图片转 ...
- Windows server 2012 添加中文语言包(英文转为中文)(离线)
Windows server 2012 添加中文语言包(英文转为中文)(离线) 相关资料: 公司环境:亚马孙aws虚拟机 英文版Windows2012 中文SQL Server2012安装包,需要安装 ...
- [LeetCode] Convert a Number to Hexadecimal 数字转为十六进制
Given an integer, write an algorithm to convert it to hexadecimal. For negative integer, two’s compl ...
- [LeetCode] Integer to English Words 整数转为英文单词
Convert a non-negative integer to its english words representation. Given input is guaranteed to be ...
- [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 ...
- [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. 这道 ...
- [LeetCode] String to Integer (atoi) 字符串转为整数
Implement atoi to convert a string to an integer. Hint: Carefully consider all possible input cases. ...
- 在.NET中把项目从类库转为Web应用程序
我们知道,在.NET中所有的项目文件以.csproj为扩展名.内容是xml格式. 类库项目文件.csproj: <Project DefaultTargets="Build" ...
随机推荐
- Numpy的学习5-array的分割
import numpy as np A = np.arange(12).reshape((3, 4)) print(A) """ array([[ 0, 1, 2, 3 ...
- 如何修改openstack虚拟机密码
1.虚拟机创建时设置密码 计算节点安装以下软件包 yum install libguestfs python-libguestfs libguestfs-tools-c 配置计算节点nova配置文件/ ...
- Python求一个数字列表的元素总和
Python求一个数字列表的元素总和.练手: 第一种方法,直接sum(list): 1 lst = list(range(1,11)) #创建一个1-10的数字列表 2 total = 0 #初始化总 ...
- (二)、vim即gvim的炫酷搜索模式与技巧
一.进入搜索模式 1. 打开文件,狂按 <Esc> 进入normal模式,然后按 / 或者 :/ 进入搜索模式,添加上关键字例如world,按回车即搜索world: :/wo ...
- 有了它(powermock)再也不担心单元测试不达标了
为什么要写单元测试 优点:单元测试可以减少bug率,提升代码的质量.还可以通过单元测试来熟悉业务. 公司硬性要求:有些公司可能还会强制要求,每次新增代码.或者变更代码单测覆盖率要达到多少比例才能申请代 ...
- react脚手架抽离webpack报错解决
我们在写react项目的时候,可能原有的webpack配置不满足我们的需求,需要自己去配置,可是你在创建脚手架的时候并不能在外部找到webpack文件,脚手架的webpack文件在node_modul ...
- java数组之system.arrayCopy
public class ArrayDemo { /* public static void main(String[] args) { int[] a=new int[4]; int[] b=new ...
- kubectl常用命令(个人记录)
一.获取pod信息 1.获取当前集群运行的所有的pods的信息 kubectl get pod 2.获取当前集群运行的所有的pod运行在哪个节点 kubectl get pods -owide ...
- 前端学习总结之——HTML
近期在找工作参加面试,想总结一下学过的东西,也会持续更新遇到的新问题.盲点. 什么是HTML? 超文本标记语言(英语:HyperText Markup Language,简称:HTML),由尖括号包围 ...
- 深入了解MySQL主从复制的原理
欢迎微信关注「SH的全栈笔记」 0. 主从复制 首先主从复制是什么?简单来说是让一台MySQL服务器去复制另一台MySQL的数据,使两个服务器的数据保持一致. 这种方式与Redis的主从复制的思路没有 ...