微信小程序 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 日,微信小程序正式上线.张小龙以这样的形式,向乔布斯致敬. 小程序在哪里? 小程序功能模 ...
随机推荐
- c语言刷 DFS题记录
144. 二叉树的前序遍历 /** * Definition for a binary tree node. * struct TreeNode { * int val; * struct TreeN ...
- 在线配置文档connectionStrings.com
在线配置文档网址:https://www.connectionstrings.com/ 用于查询以什么样的格式将连接信息写入配置文件时App.config 例如C#中写连接SQL Server的格式: ...
- HBase常用shell操作
行(row),列(Column),列蔟(Column Family),列标识符(Column Qualifier)和单元格(Cell) 行:由一个个行键(rowkey)和一个多个列组成.其中rowke ...
- 超强视频超分AI算法,从此只看高清视频
最近发现一个特别强的视频超分算法----BasicVSR,在真实世界数据集中,实现了前所未有的视觉重建效果,最近它还拿下了超分比赛NTIRE 2021三冠一亚的优异成绩,登上了CVPR 2022. 视 ...
- laravel7 webuploader上传图片
webuploader上传 前提工作: 1>了解 代码如下:1.app_path() app_path函数返回app目录的绝对路径: $path = app_path(); 你还可以使用app_ ...
- 创建vue脚手架步骤
一.在cmd配置npm淘宝镜像 npm config set registry https://registry.npm.taobao.org 二.仅第一次执行安装,安装好后关掉cmd后再开,这个时候 ...
- 浅识 npm 与 cnpm
npm是什么? Node Package(包) Manager(管理器) 的简称. 在 GitHub 还没有兴起的年代,前端是通过网址来共享代码.比如你想使用 jQuery,那么你点击 jQuery ...
- ArcMap进行天空开阔度(SVF)分析
这里的SVF并不是生物学或医学的(Stromal Vascular Fraction),而是指GIS中的(Sky View Factor,SVF),即为(城市)天空开阔度. 城市天空开阔度(Sky V ...
- VuePress 博客之 SEO 优化(五)添加 JSON-LD 数据
前言 在 <一篇带你用 VuePress + Github Pages 搭建博客>中,我们使用 VuePress 搭建了一个博客,最终的效果查看:TypeScript 中文文档. 本篇讲 ...
- Ubuntu系统中防火墙的使用和开放端口
目录 Ubuntu系统 防火墙的使用和开放端口 1.安装防火墙 2.查看防火墙状态 3.开启.重启.关闭防火墙 4.Ubuntu添加开放.关闭端口 5.开放规定协议的端口 6.关闭指定协议端口 7.开 ...