我正在学习 Web 开发，但我很难确定在这一切中什么是等效的。
我知道硬件像素和物理像素是最小的单位，与密度无关的像素通过设备像素比映射到实际的硬件像素，它们用于使观看体验更加一致。这是否意味着我看到的与设备无关的像素是相同的？
此外，我读到浏览器以 CSS 像素报告视口宽度，这些和 DIP 是一回事吗？
我知道每英寸像素是字面意思，它们是一英寸中的像素数，但它们与 DIP 有什么关系？完全独立的测量？我什么时候应该使用它？
我希望这是一个适当的问题，我在将所有这些概念连接到一张可用地图时遇到问题，并且没有发现任何其他问题可以同时解决。
【问题讨论】：
我知道硬件像素和物理像素是最小的单位，与密度无关的像素通过设备像素比映射到实际的硬件像素，它们用于使观看体验更加一致。这是否意味着我看到的与设备无关的像素是相同的？
此外，我读到浏览器以 CSS 像素报告视口宽度，这些和 DIP 是一回事吗？
在这两个方面都是。例如，height: 200px; width: 200px 的元素在 DIP 或 CSS 像素中始终为 200 x 200，即使硬件配置为以比平时更高或更低的分辨率显示也是如此。在 200% 的比例因子下，如果 1x1 DIP 或 CSS 像素以 100% 映射到 1x1 物理像素，它将映射到 2x2 物理像素正方形。
我知道每英寸像素是字面意思，它们是一英寸中的像素数，但它们与 DIP 有什么关系？完全独立的测量？
CSS 不使用 PPI；它只使用 DPI。 Section 6.4 of css-values-3 列出以下单位：
dpi
每英寸点数。dpcm
每厘米点数。dppx
每像素点数。
单位表示图形表示中单个“点”的大小，通过指示这些点中有多少适合 CSS in、cm 或 px。
就 CSS 和Media Queries 而言，单个“点”始终对应于单个物理像素，而不是 DIP 或 CSS 像素，因此是 dppx 单位。例如，200% 的比例因子或 2.0 的设备像素比（非标准）相当于 2 dppx。
【讨论】：