pt、px、DPI: 關於長度單位的誤解

長度單位

　　在印刷排版中，“point”是一個絕對的單位，它等於 1/72 英寸，可以用尺子丈量的，物理的英寸。但在 CSS 中 pt 的含義卻非如此，例如我們指定一個字型是 9pt，我們會以為按照 CSS 規範，它等於:

　　9 * 1/72 = 1/8 inch

　　這是一個誤解，因為我們的顯示器被分割為了一個個的像素，單個像素只能有一種顏色 (為了簡化，這裡暫不討論次像素反鋸齒技術)，要在螢幕上顯示，必須先把以 pt 為單位的長度轉換為以像素為單位的長度，這個轉換的媒介，就是 DPI (事實上，這裡的所謂的 DPI，是作業系統和瀏覽器中使用的術語，即為 PPI, pixels per inch，和掃描器、印表機、數位相機中的 DPI 是不同的概念)。

　　例如，無論在哪個作業系統中，Firefox 瀏覽器預設的 DPI 都是 96，那麼實際上 9pt = 9 * 1/72 * 96 = 12px。

　　所以，雖然“DPI”中的“I”和“1pt 等於 1/72 inch”中的“inch”，都不代表物理上的英寸，但這兩個單位互相之間是相等的，也就在相乘中約掉了。

　　那麼，真實的物理長度怎麼計算呢?請拿出一把尺子，丈量你的顯示器的可見寬度 (我這裡是 11.2992 英寸)，除以橫向解析度 (我這裡是 1024 像素)，得到的就是每個像素的物理長度。

　　現在我們可以回答這樣一個問題，網頁上 9pt 的字型究竟佔用了多寬的空間?答案是:

　　9 * 1/72 * 96 * 11.2992 / 1024 = 0.1324 英寸 = 0.3363 厘米。

　　有興趣的朋友可以自己查證一下。