html 字号和像素的关系,像素与分辨率的关系

像素与分辨率的关系

像素即px，是画面中最小的点(单位色块)。像素的大小是没有固定长度值的，不同设备上1个单位像素色块的大小是不一样的。

分辨率=画面水平方向的像素值 * 画面垂直方向的像素值。分辨率可以分为两方面：屏幕分辨率和图像分辨率。

1. 屏幕分辨率：

例如，屏幕分辨率是1024×768，也就是说设备屏幕的水平方向上有1024个像素点，垂直方向上有768个像素点。

像素的大小是没有固定长度的，不同设备上一个单位像素色块的大小是不一样的。

例如，尺寸面积大小相同的两块屏幕，分辨率大小可以是不一样的，分辨率高的屏幕上面像素点(色块)就多，所以屏幕内可以展示的画面就更细致，单个色块面积更小。而分辨率低的屏幕上像素点(色块)更少，单个像素面积更大，可以显示的画面就没那么细致。

2. 图像分辨率：

例如，一张图片分辨率是500x200，也就是说这张图片在屏幕上按1:1放大时，水平方向有500个像素点(色块)，垂直方向有200个像素点(色块)。

在同一台设备上，图片分辨率越高，这张图片1:1放大时，图片面积越大；图片分辨率越低，这张图片1:1缩放时，图片面积越小。(可以理解为图片的像素点和屏幕的像素点是一个一个对应的)。

但是，在屏幕上把图片超过100%放大时，为什么图片上像素色块也变的越大，其实是设备通过算法对图像进行了像素补足，我们把图片放的很大后看到的一块一块的方格子，虽然理解为一个图像像素，但是其实是已经补充了很多个屏幕像素；同理，把图片小于100%缩小时，也是通过算法将图片像素进行减少。

最后，虽然不同设备上像素块大小会不一样，但是同一台硬件设备上的屏幕分辨率、像素块大小是不会变的。PC电脑上之所以可以调整屏幕分辨率，其实也是通过算法转换了