微信小程序 iphone6 和 iphone6plus 如何设置rpx单位,通俗易懂的方法
pt:屏幕物理像素(屏幕实际宽度像素) px:屏幕分辨率 pt和px关系:iphone6plus
ppi密度高,1pt里有3px,iphone6 1pt里有2px。iphone6宽度 (物理像素) :375pt,1pt含有2px, 分辨率(设计图) 750px。
iphone6plus宽度(物理像素):414pt,1pt含有3px,分辨率(设计图)1252px。
rpx换算:
换算公式:750/屏幕实际宽度(pt)
iphone6plus(@3x) px换算rpx:
750/414=1.8115942028985508rpx
在设计图中,设计图大小为1252px;
如果一个宽度为30px换算rpx:
30/3*1.8115942028985508=8.115942028985508;
所以在微信小程序中,直接填写8.115942028985508rpx即可。
iphone6(@2x)  px换算 rpx:
750/375=2rpx;
在设计图中,设计图大小为750px;
如果一个宽度为30px换算rpx:
30/2*2=30rpx
所以在微信小程序中,直接填写30rpx即可。
rpx是在不同屏幕下可以适配的,所以使用rpx单位只要在一种设计图下适配,都可以在不同设备大小自己调节大小
通过以上例子看出做小程序时,需要设计图为以iphone6手机大小设计方案最佳!!
本文转载于:猿2048https://www.mk2048.com/blog/blog.php?id=hjb1ji2h1ib
微信小程序 iphone6 和 iphone6plus 如何设置rpx单位,通俗易懂的方法的更多相关文章
- 微信小程序中input标签高度设置
		
如果没有设置高度所以显示的是控件自身的高度. 微信小程序input控件原始设置: 上图发现: 我只覆盖了官方input的height,而没有覆盖min-height; .query input{ bo ...
 - 微信小程序顶部(navigationBar)设置为透明
		
我记得在微信小程序中导航栏的颜色可以在app.json. window里面添加navigationBarBackgroundColor属性,但是颜色只能为纯色.不能使用rgb,或者rgba的色号. ...
 - 微信小程序开发:背景图片设置
		
本文链接:https://blog.csdn.net/michael_f2008/article/details/86543134开发微信小程序时,不能直接在wxss文件里引用本地图片,运行时会报错: ...
 - 微信小程序tabBar 不显示底部菜单的原因和解决方法
		
1,书写,正确书写时tabBar,不要写成tabbar!!! 2,当创建新工程时,app.json中Pages配置是这样的 ,,[图1], 注意:微信小程序里面的json文件时不能注释的,图中只是给读 ...
 - 微信小程序-修改单选框和复选框大小的方法
		
方法有两种: 一:采用css的zoom属性 zoom缩放会将元素保持在左上角,并且会有毛边,可能会稍稍改变元素原来的形状. 二:采用css3的transform:scale属性 zoom缩放会将元素保 ...
 - 微信小程序丨将溢出的文本用省略号代替的方法
		
下面进入正题,有关于将溢出的文本用省略号代替的方法,不知道什么原因,我的程序用传统的代码无法解决: .text{ white-space: nowrap; overflow: hidden; text ...
 - 2018年1月12日--微信小程序----出错报告(40kb的原因)---并解决方法
		
一. 报错的原因是因为,图片的文件太大了,已经超过了40kb...不能超过40kb. 在这里查看图片文件的大小:
 - 微信小程序开发 [06] 一些补充的知识点
		
0.写在前面的话 前几章的内容串联起来,基本上已经能写比较基础的小程序页面逻辑了,当然,wxml和wxss的我并没有写,因为前端我也并不擅长.这个章节,准备随便叨叨,然后补充一些之前没有提到的基础知识 ...
 - 快速上手微信小程序-快递100
		
2007 年 1 月 9 日,乔布斯在旧金山莫斯科尼会展中心发布了首款 iPhone,而在十年后的 1 月 9 日,微信小程序正式上线.张小龙以这样的形式,向乔布斯致敬. 小程序在哪里? 小程序功能模 ...
 
随机推荐
- Qt:QReadWriteLock
			
0.说明 QReadWriteLock类提供了读写锁. 读写锁是一种保护那些可以读写的资源的同步工具,如果有多个线程同时要进行读操作,但是有一个线程想要写入,那么所有其他线程都会等待直到这个写线程完成 ...
 - WPS二级标题链接到一级标题
			
WPS二级标题链接到一级标题,即2后出现2.1 2.2而不是1.3 1.4什么的 样式中的编号什么的都不用动,默认即可,关键在于这些多级标题是否选择了同一个编号方式 WPS中,只需要将它们的编号选择为 ...
 - 三、Java入门
			
Java入门 Java的特性和优势 特性  简单  面对对象  可移植性 优势  性能高  分布式(跨平台:Write Once .Run Anywhere)  动态性(反射)  多线程 ...
 - linux文本处理grep
			
grep grep (global search regular expression(RE) and print out the line,全面搜索正则表达式并把行打印出来)是一种强大的文本搜索工具 ...
 - 【转载】SQL实例大全
			
from:http://blog.csdn.net/basycia/article/details/52134279 OR from:http://www.cnblogs.com/yubinfeng/ ...
 - DB门面-数据查询
			
1.1.1 查询所有数据 $selData = DB::table('article')->get(); 1.1.2 单条件查询 #DB::table('表名')->where('字段', ...
 - laravel   框架登录 实际操作
			
//登录中间件 Route::group(['middleware'=>'checkage'],function (){ Route::get('/mou/list','MouControlle ...
 - sql面试  case /union all
			
1.sum(case when results='胜' then 1 else 0 end) as '胜' 要求查询出结果: sql语句实现: select date, sum(case when r ...
 - 微信小程序结合原生JS实现电商模板(一)
			
前几天遇到一个朋友求助,实现购物车的相关功能,一时心血来潮,想着抽空搭建一个小程序电商平台(虽然网上有很多,但还是自己撸一遍才是王道),所以在工作之余整了一个仓库,今天提交了第一次代码,已经满足了朋友 ...
 - ARM中断与架构知识 精简知识点
			
目录 一.ARM系统的异常与中断 二.CPU模式与寄存器 1.ARM CPU模式 2.ARM CPU state,两种指令集 3.ARM CPU寄存器: 引申介绍一下存储空间中的数据存放 4.ARM三 ...