编程 Javascript

微信小程序 rpx 尺寸单位详细介绍

Posted in Javascript onOctober 13, 2016

微信小程序最近火了，大家开发微信小程序有没有注意微信小程序对手机屏幕的要求或者影响呢，面对不同的手机屏幕，微信

rpx单位是微信小程序中css的尺寸单位，rpx可以根据屏幕宽度进行自适应,

微信小程序尺寸单位rpx以及样式

rpx单位是微信小程序中css的尺寸单位，rpx可以根据屏幕宽度进行自适应。

规定屏幕宽为750rpx。如在 iPhone6 上，屏幕宽度为375px，共有750个物理像素，则750rpx = 375px = 750物理像素，1rpx = 0.

rpx单位是微信小程序中css的尺寸单位，rpx可以根据屏幕宽度进行自适应。规定屏幕宽为750rpx。

如在 iPhone6 上，屏幕宽度为375px，共有750个物理像素，则750rpx = 375px = 750物理像素，1rpx = 0。

rpx单位是微信小程序中css的尺寸单位，rpx可以根据屏幕宽度进行自适应。规定屏幕宽为750rpx。如在 iPhone6 上，屏幕宽度为375px，共有750个物理像素，则750rpx = 375px = 750物理像素，1rpx = 0.5px = 1物理像素。

设备 rpx换算px (屏幕宽度/750) px换算rpx (750/屏幕宽度)

iPhone5 1rpx = 0.42px 1px = 2.34px
iPhone6 1rpx = 0.5px 1px = 2rpx
iPhone6s 1rpx = 0.552px 1px = 1.81rpx

微信小程序也支持rem尺寸单位，rem和rpx的换算关系：rem: 规定屏幕宽度为20rem；1rem = (750/20)rpx

注：开发微信小程序时设计师可以用 iPhone6 作为视觉稿的标准。

感谢大家阅读，希望能帮助到大家，谢谢大家对本站的支持！

微信小程序 rpx 尺寸单位详细介绍

- Author -

lqh

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

js跨域和ajax 跨域问题的实现思路

Sep 05 Javascript

DLL+ ActiveX控件+WEB页面调用例子

Aug 07 Javascript

Js 获取Gridview选中行的内容操作步骤

Feb 05 Javascript

JS操作JSON要领详细总结

Aug 25 Javascript

如何获取select下拉框的值(option没有及有value属性)

Nov 08 Javascript

JavaScript中的立即执行函数表达式介绍

Mar 15 Javascript

jQuery实现可以控制图片旋转角度效果(附demo源码下载)

Jan 27 Javascript

sencha ext js 6 快速入门(必看)

Jun 01 Javascript

jQuery基于Ajax实现读取XML数据功能示例

May 31 jQuery

微信小程序实现商品属性联动选择

Feb 15 Javascript

JS实现瀑布流效果

Mar 07 Javascript

详解JSON.parse和JSON.stringify用法

Feb 18 Javascript

jquery实现图片切换代码

Oct 13 #Javascript

JavaScript和jQuery获取input框的绝对位置实现方法

Oct 13 #Javascript

微信js-sdk预览图片接口及从拍照或手机相册中选图接口用法示例

Oct 13 #Javascript

Javascript中this绑定的3种方法与比较

Oct 13 #Javascript

手机端实现Bootstrap简单图片轮播效果

Oct 13 #Javascript

jquery 实现轮播图详解及实例代码

Oct 12 #Javascript

ExtJS 4.2 Grid组件单元格合并的方法

Oct 12 #Javascript

You might like

一个简单且很好用的php分页类

2013/10/26 PHP

Php无限级栏目分类读取的实现代码

2014/02/19 PHP

ThinkPHP安装和设置

2015/07/27 PHP

基于PHP技术开发客服工单系统

2016/01/06 PHP

prototype.js的Ajax对象

2006/09/23 Javascript

浅析hasOwnProperty方法的应用

2013/11/20 Javascript

jQuery Ajax传值到Servlet出现乱码问题的解决方法

2016/10/09 Javascript

解决select2在bootstrap modal中不能正常使用的问题

2018/08/09 Javascript

小程序清理本地缓存的方法

2018/08/17 Javascript

默认浏览器设置及vue自动打开页面的方法

2018/09/21 Javascript

在vue使用clipboard.js进行一键复制文本的实现示例

2019/01/15 Javascript

小程序开发中如何使用async-await并封装公共异步请求的方法

2019/01/20 Javascript

微信小程序实现定位及到指定位置导航的示例代码

2019/08/20 Javascript

vue中实现高德定位功能

2019/12/03 Javascript

JavaScript JSON使用原理及注意事项

2020/07/30 Javascript

vue3.0生命周期的示例代码

2020/09/24 Javascript

axios解决高并发的方法:axios.all()与axios.spread()的操作

2020/11/09 Javascript

python模拟enum枚举类型的方法小结

2015/04/30 Python

学习Python3 Dlib19.7进行人脸面部识别

2018/01/24 Python

flask中过滤器的使用详解

2018/08/01 Python

关于python之字典的嵌套,递归调用方法

2019/01/21 Python

Python Flask 搭建微信小程序后台详解

2019/05/06 Python

python 3.74 运行import numpy as np 报错lib\site-packages\numpy\__init__.py

2019/10/06 Python

Pycharm中切换pytorch的环境和配置的教程详解

2020/03/13 Python

TensorFlow使用Graph的基本操作的实现

2020/04/22 Python

最简单的matplotlib安装教程(小白)

2020/07/28 Python

Html5 postMessage实现跨域消息传递

2016/03/11 HTML / CSS

预订全球最佳旅行体验：Viator

2018/03/30 全球购物

求职信模板标准格式范文

2014/02/23 职场文书

经典安踏广告词

2014/03/21 职场文书

创建绿色社区汇报材料

2014/08/22 职场文书

付款承诺函范文

2015/01/21 职场文书

家长对孩子的寒假评语

2015/10/09 职场文书

2016春季幼儿园大班开学寄语

2015/12/03 职场文书

干货干货！2019最新优秀创业计划书

2019/03/21 职场文书

Java基础——Map集合

2022/04/01 Java/Android