px、em、rem区别 pt ppi dpi vw vh

简介: px、em、rem区别 pt ppi dpi vw vh

px

image.png

为什么像素的物理尺寸不固定?

image.png

都是图片相关信息,图片体积和像素有什么关系?

image.png

为什么我们要买高像素的相机?

image.png

image.png

ppi:像素密度(pixel per inch)

image.png

image.png

为什么说ppi决定图片的物理尺寸?

image.png

注意:

同一显示屏上查看图片,像素量越大,图片尺寸越大。

显示分辨率一定的情况下,显示屏越小图像越清晰(比如MacBook),反之,显示屏大小固定时,显示分辨率越高图像越清晰。

对于设计师来说像素密度很重要,需要很据像素密度来切图和适配,理解了像素密度的意义,就理解了几倍图之间的关系。


目录
相关文章
|
7月前
vw、px、vh 和 rem应用场景以及区别
【4月更文挑战第2天】 vw、px、vh 和 rem应用场景以及区别
1002 10
|
前端开发
常用单位 px像素 %百分比 rem em vw vh pt磅值
常用单位 px像素 %百分比 rem em vw vh pt磅值
|
7月前
|
编解码 前端开发 小程序
CSS中rpx、px、em、rem、%、vh、vw各自都代表什么
CSS中rpx、px、em、rem、%、vh、vw各自都代表什么
141 0
|
1月前
|
UED
em/px/rem/vh/vw区别
【10月更文挑战第24天】理解和掌握 em、px、rem、vh、vw 这几种单位的特点和应用,能够帮助我们更好地进行网页设计和布局,实现更优秀的用户体验和适应不同屏幕尺寸的能力。
|
2月前
Px,em,rem的区别
【10月更文挑战第10天】 Px,em,rem的区别
103 2
|
2月前
|
前端开发 小程序 JavaScript
面试官:px、em、rem、vw、rpx 之间有什么区别?
面试官:px、em、rem、vw、rpx 之间有什么区别?
59 0
|
5月前
|
编解码 前端开发
CSS【详解】长度单位 ( px,%,em,rem,vw,vh,vmin,vmax,ex,ch )
CSS【详解】长度单位 ( px,%,em,rem,vw,vh,vmin,vmax,ex,ch )
81 0
|
7月前
|
编解码 前端开发 容器
vh,vw,px,%有什么区别
vh,vw,px,%有什么区别
374 0
|
7月前
|
编解码
px,em,rem,vw,vh之间的区别
px,em,rem,vw,vh之间的区别
|
7月前
|
编解码 前端开发
CSS中单位:【px和%】【em和rem】【vw|vh|vmin|vmax】的区别
CSS中单位:【px和%】【em和rem】【vw|vh|vmin|vmax】的区别
169 0