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单位,通俗易懂的方法的更多相关文章

  1. 微信小程序中input标签高度设置

    如果没有设置高度所以显示的是控件自身的高度. 微信小程序input控件原始设置: 上图发现: 我只覆盖了官方input的height,而没有覆盖min-height; .query input{ bo ...

  2. 微信小程序顶部(navigationBar)设置为透明

    我记得在微信小程序中导航栏的颜色可以在app.json.  window里面添加navigationBarBackgroundColor属性,但是颜色只能为纯色.不能使用rgb,或者rgba的色号. ...

  3. 微信小程序开发:背景图片设置

    本文链接:https://blog.csdn.net/michael_f2008/article/details/86543134开发微信小程序时,不能直接在wxss文件里引用本地图片,运行时会报错: ...

  4. 微信小程序tabBar 不显示底部菜单的原因和解决方法

    1,书写,正确书写时tabBar,不要写成tabbar!!! 2,当创建新工程时,app.json中Pages配置是这样的 ,,[图1], 注意:微信小程序里面的json文件时不能注释的,图中只是给读 ...

  5. 微信小程序-修改单选框和复选框大小的方法

    方法有两种: 一:采用css的zoom属性 zoom缩放会将元素保持在左上角,并且会有毛边,可能会稍稍改变元素原来的形状. 二:采用css3的transform:scale属性 zoom缩放会将元素保 ...

  6. 微信小程序丨将溢出的文本用省略号代替的方法

    下面进入正题,有关于将溢出的文本用省略号代替的方法,不知道什么原因,我的程序用传统的代码无法解决: .text{ white-space: nowrap; overflow: hidden; text ...

  7. 2018年1月12日--微信小程序----出错报告(40kb的原因)---并解决方法

    一. 报错的原因是因为,图片的文件太大了,已经超过了40kb...不能超过40kb. 在这里查看图片文件的大小:

  8. 微信小程序开发 [06] 一些补充的知识点

    0.写在前面的话 前几章的内容串联起来,基本上已经能写比较基础的小程序页面逻辑了,当然,wxml和wxss的我并没有写,因为前端我也并不擅长.这个章节,准备随便叨叨,然后补充一些之前没有提到的基础知识 ...

  9. 快速上手微信小程序-快递100

    2007 年 1 月 9 日,乔布斯在旧金山莫斯科尼会展中心发布了首款 iPhone,而在十年后的 1 月 9 日,微信小程序正式上线.张小龙以这样的形式,向乔布斯致敬. 小程序在哪里? 小程序功能模 ...

随机推荐

  1. Python:2维(平面/数组/矩阵)缺省值插值

    学习自:python插值填补缺省值_插值缺失值2d python_weixin_39592315的博客-CSDN博客 问题 假设我们有一个2D数组(或者矩阵),其中有一些缺省值NaN,就像下边这样: ...

  2. Python:获取某一月的天数

    import calendarcalendar.monthlen(2021,6)30calendar.monthrange(2021,6)(1, 30) calendar.monthrange( ye ...

  3. c# 窗体相关操作(最大化/最小化/关闭/标题栏)

    /// <summary> /// 窗体跟随鼠标移动的标记 /// </summary> private bool normalmoving = false; /// < ...

  4. Cache一致性与DMA

    cache一致性与DMA 第一个问题 对于进行DMA操作的设备, 并不是所有系统都保持它们的cache一致性.在这种情况下, 准备进行DMA的设备可能从RAM得到陈旧的数据, 因为脏的cache行可能 ...

  5. RT-Thread学习2 —— 内存管理学习记录

    RT-Thread学习2 -- 内存管理学习记录1 小内存管理算法(mem.c) 1. 小内存管理法: 小内存管理算法是一个简单的内存分配算法.初始时,它是一块大的内存.当需要分配内存块时,将从这个大 ...

  6. python hex转flaot

    在使用树莓派 modbus-tk 读取寄存器值后,得到的4byte值存为了元组,想将该数据转化为float,习惯了c的用法,转到python时,数据转换这一块一头雾水,经过多次尝试最终实现.记录一下: ...

  7. Linux CentOS7.X-目录操作命令

    一.安装vim 由于安装Centos7MINI版本里面没有vim命令,只有vi命令,所以安装vim命令,默认系统只带了vim-minimal.x86_64包,需要安装其他的3个包才能用vim命令 1. ...

  8. CoLAKE: 如何实现非结构性语言和结构性知识表征的同步训练

    原创作者 | 疯狂的Max 论文CoLAKE: Contextualized Language and Knowledge Embedding 解读 01 背景与动机 随着预训练模型在NLP领域各大任 ...

  9. unittest的discover方法批量执行02

    前言 我们在写用例的时候,单个脚本的用例好执行,那么多个脚本的时候,如何批量执行呢?这时候就需要用到unittet里面的discover方法来加载用例了. 加载用例后,用unittest里面的Text ...

  10. 1.java连接pulsar服务

    目录 是什么 安装 Java客户端 1.引入GAV 2.创建配置项 3.验证测试 其他及代码下载 是什么 Pulsar 是一个用于服务器到服务器的消息系统,具有多租户.高性能等优势.详见 安装 本文主 ...