首页 > 其他分享 >尺寸单位

尺寸单位

时间:2023-01-30 22:37:08浏览次数:45  
标签:20 px 单位 尺寸 rem const 375

rem

先将1rem设为屏幕宽度的1/20:

document.addEventListener('DOMContentLoaded', function () {
  document.documentElement.style.fontSize = document.documentElement.clientWidth / 20 + 'px'
})

假设设计稿的屏幕尺寸是375*675,一个尺寸值是100px,那么这个尺寸值用rem表示就是:

100/(375/20) = 100 * 20 / 375 = 5.33 (rem)

如果看不懂,看下面的伪代码:

const screen_width = 375
const rem = screen_width / 20  // 1rem等于多少px
const size_in_px = 100
const size_in_rem = size_in_px / rem

rpx

rpx时微信小程序解决自适应屏幕尺寸的尺寸单位。微信小程序规定屏幕的宽度为750rpx。

由于iphone6的屏幕宽度为375px,换算成750rpx就是1:2的关系,因此很多开发者经常会以iphone6来进行设计。

标签:20,px,单位,尺寸,rem,const,375
From: https://www.cnblogs.com/hdxg/p/17077424.html

相关文章

  • 单位根反演
    单位根反演,其实就一个式子。\[[n|a]=\frac1n\sum_{k=0}^{n-1}w_n^{ak}\]证明在我的FFT博客里边。正经做题的时候由于经常对大质数取模,所以单位根一般都是原根。主要......
  • 计算机数据单位
    一.名称解释1、位(bit)来自英文bit,音译为“比特”,表示二进制位。位是计算机内部数据储存的最小单位,11010100是一个8位二进制数。一个二进制位只可以表示0和1两种状态(21);两个二......
  • 金蝶云星空对接打通四化智造MES(API)逐个单据查询接口与新增计量单位接口
    金蝶云星空对接打通四化智造MES(API)逐个单据查询接口与新增计量单位接口源系统:金蝶云星空金蝶K/3Cloud(金蝶云星空)是移动互联网时代的新型ERP,是基于WEB2.0与云技术的新......
  • CSS尺寸设置的单位
    解题思路得分点px、rem、em、vw、vh标准回答px:pixel像素的缩写,绝对长度单位,它的大小取决于屏幕的分辨率,是开发网页中常常使用的单位。em:相对长度单位,在......
  • 8、CSS权威指南--第四章(p121)值和单位
     4.1关键字、字符串和其他文本值样式表中的一切都是文本,但是有些类型的值表示的是字符串本省,而不是数字或颜色等。表示字符串本身的值有URL和让人难以置信的图像。4......
  • matplotlib 设置图画长宽比、尺寸
    设置图片长宽比pythonmatplotlib的画布长宽比不仅会影响长宽,还会影响画布大小。设置画布大小的方法有下:plt.figure(figsize=(2,1))plt.rcParams['figure.figsize']=(......
  • P25_rpx单位
    模板样式-rpx什么是rpx尺寸单位rpx(responsivepixel)是微信小程序独有的,用来解决屏适配的尺寸单位。rpx的实现原理rpx的实现原理非常简单:鉴于不同设备屏幕的......
  • Mysql之以月为单位给表建立分区
    以月为单位给表建立分区ALTERTABLExxxxPARTITIONBYRANGE(to_days(`CREATE_TIME`))(PARTITIONfrom202301VALUESLESSTHAN(TO_DAYS('2023-02-01')),PARTITION......
  • 阅文加入 OpenCloudOS 操作系统社区,作为成员单位参与社区共建
    近日,阅文集团宣布加入OpenCloudOS操作系统开源社区。阅文集团成立于2015年3月,是一家以数字阅读为基础,IP培育与开发为核心的综合性文化产业集团,旗下囊括QQ阅读、起......
  • Labview视觉一键尺寸测量仪,多产品,多尺寸,快速编辑, 测量,导出结果
    Labview视觉一键尺寸测量仪,多产品,多尺寸,快速编辑,测量,导出结果​​查看资料来源​​......