理解分辨率相关知识

注意区分设备像素和css逻辑像素

在CSS规范中，长度单位可以分为绝对单位和相对单位。px是一个相对单位，相对的是设备像素（Device Pixels）。

iPhone 官网写的是设备像素数，例如640x1136px，也就是真实的点 而CSS逻辑像素数为320x568px，开发的时候写图像20px x 20px是指相对单位，1x的设备，就是20个物理点，2x的设备，就是40个物理点

每英寸像素(Pixels Per Inch)，又称像素密度: wikipedia

iPhone iPad ppi对比 可以看到iPhone ppi比iPad的高，是因为iPhone的尺寸比iPad的小很多，尽管iPad的像素分辨率高

分辨率

px: Pixel(像素)

2532px X 1170px

响应式图片

源码：github1s.com/mdn/learnin…

响应式图像教程

svg png 等格式的区别，优缺点。svg的使用方式

无障碍要求

网页中img需要填写适当的alt，这样的话，障碍人士读取的网页的时候可以想象图片中的内容。

但是，是否会有：服务器端AI自动图像识别然后自动配alt文字？

问题

• 单倍像素密度是指？

• 宽度描述符？

主要理解下面这句话：

• iPad 和 iPhone 谁更清晰？

  iPhone

<img
              alt='澳门LOGO'
              src={bg}
              srcSet={`
                ${home} 2x, -> iPad显示
                ${bgDesktop} 3x, -> iPhone显示
              `}

用chrome可以模拟到ppi