互联网从微信源起步远道而来,设备也是如此现代We设计需要能提供各种显示尺寸网页,从超广域监视器、电视机、手机和中间的一切UI/UX设计师必须记住具体测量:设备像素比
设备像素比法
设备像素比(DPR)指设备物理像素密度与其逻辑像素密度之比物理像素可见于屏幕上,而逻辑像素则测量乘以几分位或cm(视设置而定)。
DPR计算为DPR=物理像素/逻辑像素
为何DPR重要
开始设计并搭建网站前, 关键是要知道终端用户浏览设备像素比设备像素比度量设备上虚拟空格中物理像素数
网络开发者通常使用HTML和CSS定位元素页面,使用CSS像素测量精确定位CSS像素不完全与所有设备相联-屏幕大小太多无法跟上
iPhone6分辨率为1334x750(375dpi)
- 1334/750=1.6物理像素/千分之换句话说,屏幕上每个像素16x16物理单元宽16x16物理单元高-或3x3方块总和
表示如果我们想在网站设计上宽度50px-100%缩放度(Ix),则宽度应50/3=16px/
设备像素比在我的设计过程中如何使用
设备像素比设计网站右侧设备使用右尺寸图像可确保它在所有设备上看起来都不错。还需要确保媒体查询改变布局和CSS改变不同断点元素的字体大小或背景色
