概念
-
英寸
1英寸 大概2.54cm
5.5英寸 指的是手机对角线 -
像素
. 一个屏幕都是由一个一个像素组建而成的,每个像素都对应一个小点。我们常见的 640*960 像素就说明了一个屏幕中包含了多少个小点(像素点),640列与960行像素点,乘一下就知道有多少个了,反正很多很多个。没错,手机中显示的任何图形和图像都是由这些小点组成。 -
分辨率
.、 720x1280
. 、 750x1334 横向容纳750个像素点 纵向容纳1334个像素点 -
ppi
— pixcei per inch 像素每英寸
每英寸像素点的数量
电子设备72
打印小文件 300
宣传栏 150-200 -
dpi
在手机上 每英寸容纳的点的大小dot per inch -
视网膜屏
. Retina屏 dpi(dot per inch)超过300的屏幕 -
单位pt
换算像素px
iphone 5/6/7
1:2
iphone 5 6 7plus
1:3
iphonx
1:3 -
常见尺寸
状态栏20pt
导航栏44pt
列表44pt
底部49pt
列表图标/分段器29pt
switch w51 h31 r28 -
常见间距
8pt
15pt -
常见的文字
标题17pt
正常13pt
最新10pt -
前端如何运用
设计师的设计稿
750x1334
2倍
720x1280
2倍
1242x2208
3倍
1080x1920
3倍
看网上 -
尺寸安排方式
如果以像素为单位
设计稿子尺寸/倍数
设计稿:88px
写height:44px @2倍
设计稿:60px
写height:20px@3倍
- 以rem为单位