当前位置: 首页 > news >正文

微信小程序适配方案:rpx(responsive pixel响应式像素单位)

小程序适配单位:rpx

规定任何屏幕下宽度为750rpx

小程序会根据屏幕的宽度自动计算rpx值的大小

Iphone6下:1rpx = 1物理像素 = 0.5css

小程序编译后,rpx会做一次px换算,换算是以375个物理像素为基准,也就是在一个宽度为375物理像素的屏幕下,1rpx=1px,举个例子:IPhone6屏幕宽度为375px,共750个物理像素,那么1rpx=375/750px=0.5px

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

IPhone5     1rpx=0.42px                      1px=2.34rpx

IPhone6      1rpx=0.5px                       1px = 2rpx

IPhone6 Plus    1rpx = 0.552px          1px = 1.81rpx

一般情况下,我们所选用的机型是IPhone6  因为它对于换算来说会比较方便一点

那么除了使用wxss之外,我们同样也可以使用less来定义样式

使用 Less 可以让样式表更加简洁、易读、易维护。

首先我们需要配置

配置完成之后我们就可以使用less来定义样式了,

需要注意的是,使用 Less 编写样式会增加编译时间和运行时间的开销,如果项目比较小,建议直接使用原生的 CSS 样式;如果项目比较大,可以考虑使用 Less 来提高样式表的可维护性和可重用性。

http://www.lryc.cn/news/256157.html

相关文章:

  • vue2 echarts饼状图,柱状图,折线图,简单封装以及使用
  • Linux信息收集
  • 三种定时任务总结
  • [足式机器人]Part2 Dr. CAN学习笔记-数学基础Ch0-6复数Complex Number
  • 使用 MITRE ATTCK® 框架缓解网络安全威胁
  • 从零构建属于自己的GPT系列4:模型训练3(训练过程解读、序列填充函数、损失计算函数、评价函数、代码逐行解读)
  • 光学遥感显著目标检测初探笔记总结
  • HttpComponents: 领域对象的设计
  • 使用wire重构商品微服务
  • 大三上实训内容
  • IOT安全学习路标
  • java中线程的状态是如何转换的?
  • 处理合并目录下的Excel文件数据并指定列去重
  • Numpy数组的去重 np.unique()(第15讲)
  • ROS-log功能区别
  • 学习git后,真正在项目中如何使用?
  • Qt国际化翻译Linguist使用
  • ShardingSphere数据分片之分表操作
  • 基于ssm鲸落文化线上体验馆论文
  • LeetCode Hot100 131.分割回文串
  • SAP UI5 walkthrough step9 Component Configuration
  • 【数据结构和算法】--- 栈
  • CentOS7.0 下rpm安装MySQL5.5.60
  • 智慧能源:数字孪生压缩空气储能管控平台
  • 【链表OJ—反转链表】
  • TCP一对一聊天
  • 基于Java的招聘系统的设计与实现
  • spring boot整合mybatis进行部门管理管理的增删改查
  • 微软 Power Platform 零基础 Power Pages 网页搭建高阶实际案例实践(四)
  • 如何在任何STM32上面安装micro_ros