在鉆研CSS單位時，我遇到了參考像素的定義。然而，我無法找到一個一致的和全面的描述它與CSS像素單元的關系。我對這件事做了一些研究，但對我來說還是有點不清楚。

1.收集的信息 1.1像素定義 像素有兩種不同的類型/定義:

“設備像素”——顯示器上的單個物理點。

并且:

CSS像素—與參考像素最匹配的單位。

盡管將參考像素定義為視角，我們可以進一步理解為:

"對于一臂長的讀數，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。

這種測量允許我們猜測顯示器的類型。 快速檢查:

IPhone 6 (4.7”，1334×750):326 PPI； 索尼Bravia 4K (54.6英寸，3840×2160): 75 ppi。 所以，總的來說，PPI越大，用戶離屏幕越近。下表

從上面的引語中，我得出了以下結論。

單位px是絕對的，由等式1px = 1/96in定義。對于ppi為96的屏幕，當從28英寸的距離觀看屏幕時，1px的長度對應于設備像素的實際邊長。

對于其他設備，制造商根據像素密度ppi選擇最佳距離d。制造商如何找到最佳距離仍然是他的秘密。

參考像素由y給出。根據截距定理，y = d/(28 * 96)如下。

現在，y必須由器件像素的整數ndevpix來最佳逼近。ndevpx的值取決于屏幕的ppi，由下式給出

NDE vpx = Int(y * PPI)= Int((d * PPI)/(28 * 96))，

其中Int(x)是數字x的最佳整數近似值。

示例iPhone SE: ppi = 326，d = 16.8，ndevpx = Int(2.03)。所以蘋果為1px選擇了2個設備像素。