微信小程序的尺寸单位rpx介绍
rpx单位是微信小程序中css的尺寸单位,rpx可以根据屏幕宽度进行自适应。
规定屏幕宽为750rpx。如在 iPhone6 上,屏幕宽度为375px,共有750个物理像素,则750rpx = 375px = 750物理像素,1rpx = 0.5px
设备 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 =37.5rpx;
注:开发微信小程序时设计师可以用 iPhone6 作为视觉稿的标准,单位换算相对简单。
微信小程序的尺寸单位rpx介绍的更多相关文章
- 微信小程序-01-项目组成文件介绍(入门篇)
自古开篇先说两句,写这些笔记不是学习用的,主要是后续分享一些遇到的坑,碰到过什么样的问题,怎么去解决,如果你不是一个很耐心无看文章的人,建议去 网易云课堂找一些课程,跟着别人的脚步或许会更有动力,我的 ...
- 微信小程序中的单位
vw:viewpoint width,视窗宽度,1vw等于视窗宽度的1%. vh:viewpoint height,视窗高度,1vh等于视窗高度的1%. rpx:rpx单位是微信小程序中css的尺寸单 ...
- 关于微信小程序的尺寸关系
在微信小程序开发中,大家尽量使用rpx为单位, px实际上就是系统级的rem(把页面按比例分割750份,1rpx=window.innerWidth/750),或者scale伸缩布局的width=75 ...
- 微信小程序产品定位及功能介绍
产品定位及功能介绍 微信小程序是一种全新的连接用户与服务的方式,它可以在微信内被便捷地获取和传播,同时具有出色的使用体验. 小程序注册 注册小程序帐号 在微信公众平台官网首页(mp.weixin.qq ...
- 微信小程序目录结构与配置介绍
一.小程序结构目录 小程序框架提供了自己的视图层描述语言 WXML 和 WXSS,以及 JavaScript,并在视图层与逻辑层间提供了数据传输和事件系统,让开发者能够专注于数据与逻辑. 官网 1.1 ...
- 微信小程序结构目录、配置介绍、视图层(数据绑定,运算,列表渲染,条件渲染)
目录 一.小程序结构目录 1.1 小程序文件结构和传统web对比 1.2 基本的项目目录 二.配置介绍 2.1 配置介绍 2.2 全局配置app.json 2.3 page.json 三.视图层 3. ...
- 微信小程序开发——全局配置详细介绍
本文针对官方文档未说明清楚的进行详细探索研究,官方文档详见:全局配置 . pages: 删除页面,需要先删除app.json中pages对应页面的路径,再去删除页面相关的所有文件,不然会出现页面文件混 ...
- 微信小程序中的app文件介绍
[app] 一.app.json 1.对当前小程序的全局配置 2.页面路径.界面表现.网络超时时间.底部 tab 等 { "pages":[ "pages/index/i ...
- 微信小程序开发-rem转换rpx小工具
实现原理: 对样式进行格式化,然后根据 “rem” 进行拆分,这样就会拆分成一个数组 [str1,str2,str3...,str6], 除了最后一个元素,前边的元素都会以 “rem” 样式的数值结尾 ...
随机推荐
- 如何为linux服务器配置DNS解析?
本文建立在已经搭建好DNS服务器时,为linux机器配置DNS服务器的三种方式. IP地址是网络上标识站点的数字地址,为了方便记忆,采用域名来代替IP地址标识站点地址.DNS(域名解析)就是域名到IP ...
- Android之LinearLayout布局下怎么让按钮固定在底部
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android=&quo ...
- Spring Environment抽象
1:概述 Spring中Environment是Spring3.1版本引入的,是Spring核心框架定义的一个接口,用来表示整个应用运行时环境.该环境模型只接受两种应用环境profiles(配置文件) ...
- MapReduce in MongoDB
MongoDB の MapReduce 在Hadoop的学习中已经接触过MapReduce了,它是一个很成熟的计算模型,将大批量的工作(也就是数据)分解(MAP映射)执行,最后将结果合并成最终的Red ...
- CentOS 6.x 安装 JDK1.8
安装方式:rpm(此方式不需要手动配置环境变量) 1. 查看系统是否自带了jdk 查看centos是否自带了openjdk,如果有则卸载掉(当然也可以不卸载,但要注意冲突及版本的使用) # 查看 rp ...
- 设计模式-访问者模式(Visitor)
访问者模式是行为模式的一种.访问者模式的基本想法是,软件系统中拥有一个由许多对象构成的.比较稳定的对象结构,这些对象的类都拥有一个accept方法用来接受访问者的访问.访问者是一个接口,它拥有一个vi ...
- 记2017沈阳ICPC
2017沈阳ICPC 10月20日 早上十点抵达沈阳,趁着老师还没到,跑去故宫游玩了一下,玩到一点多回到宾馆,顺便吃了群里大佬说很好吃的喜家德虾饺(真的好好吃),回到宾馆后身体有点不舒服了,头晕晕的, ...
- ArrayList的add方法实现
ArrayList的底层是由数组实现,所以所有的操作都是围绕数组展开,要想理解add方法,就得先了解数组的增加,所以我们先实现一个数组的add,数组的添加可以从尾部增加或者其他位置插入, 如果在数组的 ...
- python3 连接数据库注意点
类库:pymysql ''' Created on 2019年 @author: Root ''' import pymysql from name import getName # 数据库连接信息 ...
- VB非常见知识总结
1.VB.Net设置Excel中单元格字体 sheet.Range(sheet.Cells(row, stp), sheet.Cells(row, stp)).Font.Name = "Wi ...