如何计算CSS像素大小？
在深入研究CSS单元时，我遇到了参考像素的定义。 但是，我无法找到与CSS像素单元关系的一致和全面的描述。 我在这件事上做了一些研究，但对我来说还是有点不清楚。
1.收集到的信息
1.1像素定义
像素有两种不同的类型/定义：
“设备像素” - 显示屏上的单个物理点。
和：
CSS像素 - 最接近匹配参考像素的单位。 [1]
两个同名的平行概念绝对不能说明混淆。 我完全理解引入第二个的目的，但我觉得它的命名有误导性。 CSS像素被分类为绝对单位，并且：
“绝对长度单位相对于彼此是固定的。” [1]
除了像素之外，上述说法对于每个单元都非常明显。 遵循w3c规范：
“对于CSS设备，通过将物理单位与他们的物理测量相关联，或者（ii）通过将像素单位与参考像素相关联来固定这些尺寸（i）。
（...）请注意，如果锚点单位是像素单位，则物理单位可能与其物理测量值不匹配。 或者，如果锚单元是物理单元，则像素单元可能不会映射到整个设备像素。“[1]
考虑到上述引文，我假设绝对单位不是绝对的，因为它们可能会锚定到参考像素。
1.2参考像素
参考像素本身实际上是一种角度测量[2]：
“参考像素是设备上一个像素的视角，像素密度为96dpi，距手臂长度为读取器的距离，对于标称臂长为28英寸的情况，视角约为0.0213度。” [1]
以下图片显示的内容如下：
尽管将参考像素定义为视角，但我们可以进一步阅读：
“对于手臂长度来说，1px因此相当于大约0.26毫米（1/96英寸）。”
抛开不一致的地方，我们能够确定角度的价值：
α = 2 * arctan(0.026/142) = 0.02098°
where:
α — a value of the visual angle
因此显示单位的大小等于：
y = 2x * tan(0.01049°)
where:
y — a displayed unit size
x — a reading distance
根据上述公式，为了计算单位大小，我们需要确定实际的阅读距离。 由于用户可能会有所不同，其分类基于设备的DPI。
1.2.1新闻部
为了方便起见，我们假设DPI == PPI 。
这个测量允许我们猜测显示类型。 快速检查：
所以，一般来说，越靠近用户所坐的屏幕越大的PPI。 下表[3]给出了具有特定DPI的设备的阅读距离推荐：
———————————————————————————————————————
| DPI | Pixel size | Reading distance |
—————————————————————————————————————————————————————
|PC's CRT | 96 | ~0.2646 mm | ~71 cm |
|display | | | |
—————————————————————————————————————————————————————
|Laptop's LCD | 125 | 0.2032 mm | ~55 cm |
|display | | | |
—————————————————————————————————————————————————————
|Tablet | 160 | ~0.159 mm | ~43 cm |
—————————————————————————————————————————————————————
但是，我不清楚这些距离值是如何获得的。 与功能描述的DPI的关系还是只是一种经验观察？
1.2.2设备像素比例
视网膜显示的推出使事情更加复杂化。 它的PPI往往比非Retina大约大2倍，而推荐阅读距离应该保持不变。 由于CSS像素大小不一定与设备像素大小相对应，因此我假设Retina显示屏上的单位大小首先被转换为参考像素大小（以设备像素表示），然后再乘以像素比率。 这是对的吗？
1.2.3缩放
在放大时，显示的参考像素尺寸增加[4]，与显示器的距离增加。 这很违反直觉，因为这意味着我们正在从屏幕上“走开”，而不是靠近它。
2.问题
结束我的怀疑和清晰的问题：
另外，如果我的推理无效或者我错过了某些东西，请纠正我。 感谢您的回复。
3.参考文献
我可能是错的，但我认为CSS像素不可能将物理单位作为锚点。
基于这篇文章：
PX单元是CSS的魔法单元。 它与当前字体无关 ，也与绝对单位无关 。 px单位被定义为很小但可见，并且可以显示具有尖锐边缘的水平1px宽线条（无抗锯齿）。 什么是尖锐的，小的和可见的取决于设备和使用方式：它是否像手机一样靠近你的眼睛，手臂长度，如电脑显示器，还是其他地方，如书本？ 因此px没有被定义为恒定的长度，而是取决于设备的类型及其典型用途。
更新：我错了。 目前在任何浏览器中都可能没有实现。 在这种情况下，根据规格： “这些尺寸要么固定（i）通过将物理单位与他们的物理测量相关联”，这意味着1px将等于物理英寸的1/96。
至于表格中DPI与读取距离之间的关系，如果DPI = 96，则读取距离为〜71cm或28in，并且这些值成反比，意味着较高的DPI将导致较小的读取距离。
从中很容易得出一个公式：
x = 125/96
y = 71/x
where:
x - ratio between second and first DPI value
y - reading distance for second DPI value
对于更高分辨率的设备，Mozilla黑客文章中给出了一个较低的例子：
我们以iPhone 4作为最着名的例子。 它配备了326 DPI显示屏。 根据我们上表，作为智能手机，它的典型观看距离为16.8英寸，基准像素密度为160 DPI。 为了创建一个CSS像素，Apple选择将设备像素比率设置为2，这有效地使iOS Safari以与在163 DPI电话上相同的方式显示网页。
这意味着我们有两个解决方案 - 物理（PPI）和CSS一个（cssppi）。 看来cssppi用于计算参考像素大小，然后设备制造商会选择它们将映射到一个CSS像素的多少参考像素（我假设这个数字等于设备像素比值，但不是100％确定）。
以下是一些常见设备像素比例，PPI和cssppi的比较表：http://mydevice.io/devices/
有关更多信息和参考检查以下文章：