PT轉PX轉換器

PT轉PX轉換器 會將點數轉成像素，也能將像素轉回點數，適用於螢幕和印刷工作。多數轉換器只會根據固定的 CSS 比例 1pt = 1.3333px 給你一個數字。這個答案在瀏覽器中正確，但幾乎在其他地方都不對，因為點數是物理單位，其中包含多少像素取決於輸出的解析度。本工具會同時提供兩種結果：瀏覽器實際呈現的 CSS 值，以及在 72、150、300、600 或任何自訂 DPI 下的裝置像素值，還會顯示以真實尺規量出的毫米和英吋實際尺寸。

PT 轉 PX 公式

一個點數的定義正好是一英吋的七十二分之一。一英吋包含多少像素，取決於輸出解析度。將這兩個事實放在一起，就能得到轉換公式：

在網頁上，解析度不是變數。CSS 規範依定義將 1in = 96px 固定下來，因此瀏覽器一律使用 96，公式也會化為固定比例：

這就是為什麼 12pt 在每個裝置上的每個瀏覽器中都是 16px，不論它是 1× 的筆記型電腦面板，還是 3× 的手機螢幕。CSS 像素是參考單位，不是硬體像素。

一英吋，三種名稱

要分清楚這些單位，最簡單的方法是記住：它們描述的是相同的物理距離。下方每條長條的寬度都正好是一英吋：

PT 轉 PX 對照表

CSS 使用網頁欄位。將 PDF 輸出為點陣圖、製作列印檔案版面，或設定將要列印的點陣圖文字大小時，請使用 300 DPI 欄位。

為什麼相同點數大小會得到不同的像素數

這是最容易讓人困惑的一點，因此值得明確說明。實際尺寸永遠不變：12pt 一律是六分之一英吋。改變的是你對這一英吋取樣的細緻程度。

• 72 DPI — 歷史上的 Macintosh 螢幕解析度，特別選定為 1pt = 1px。某些舊版影像流程仍以此為預設值，這就是為什麼 12pt 文字有時會以令人失望的 12 像素輸出。
• 96 DPI — Windows 預設值，也是 CSS 所依據的參考解析度。這是網頁答案，也是瀏覽器使用的數值。
• 150 DPI — 草稿列印品質，或適合從遠處閱讀的大型印刷作品。
• 300 DPI — 商業印刷標準。300 DPI 輸出中的 12pt 圖說需要 50 像素高度，而不是 16。
• 600 DPI — 精細線稿、高階印刷工作，以及需要呈現細線的雷射輸出。

如果你曾經以「正確尺寸」輸出圖稿，卻發現文字變得模糊且像素化，幾乎總是這個比例造成的：版面以點數衡量，但點陣圖卻以 72 或 96 DPI 而不是 300 DPI 產生。

點數大小實際測量的是什麼

12pt 字型並不是 12 點高的可見文字。點數大小描述的是 em 方格——字型所繪製的不可見設計格線。字母佔據這個方格的多少完全取決於字體設計師，因此同樣點數大小的兩種字型，視覺比例可能大不相同。

在 CSS 中應該使用 pt 還是 px？

在螢幕樣式中，請使用 px 或 rem。點數是 CSS 中的絕對單位，與 px 完全相同，因此有相同的無障礙缺點：以 pt 設定的文字會忽略訪客的瀏覽器字型大小偏好。使用 pt 也容易造成混淆，因為閱讀樣式表的同事可能會以為它代表輸出裝置上的實體點數，但實際上並不是。

pt 真正適合使用的地方是列印樣式表，因為輸出確實以英吋測量：

@media print {
  body { font-size: 11pt; line-height: 1.45; }
  h1   { font-size: 24pt; }
  h2   { font-size: 18pt; }
  .no-print { display: none; }
}

瀏覽器會在產生列印工作時，按照實際紙張尺寸換算這些點數，因此 11pt 的本文在頁面上確實會呈現為 11pt——和文書處理器產生的大小相同。

將 Word 或 InDesign 文件轉換為網頁

1. 直接從文件的樣式表取得點數大小——通常本文為 11pt、小標題為 16pt、標題為 24pt。
2. 一次將它們全部貼到值欄位，以逗號分隔，並將解析度維持在 96。
3. 讀取 CSS 像素欄。11pt 會變成 14.67px，16pt 會變成 21.33px，24pt 會變成 32px。
4. 發布前將它們四捨五入為整齊的級距。印刷排版可以容忍奇數分數；網頁字級比例在整數或半像素時更易讀，因此 14.67px 通常會變成 15px 或 16px。
5. 如果你的設計系統使用相對單位，請將最終像素值轉換為 rem。

相關 CSS 絕對單位

點數是 CSS 以同一個 96 像素英吋為基準定義的一小組絕對單位之一。了解完整家族後，轉換就很簡單：

• 1in = 96px = 72pt = 6pc = 25.4mm
• 1pc（pica）= 12pt = 16px
• 1cm = 37.795px ≈ 28.35pt
• 1mm = 3.7795px ≈ 2.835pt
• 1Q（四分之一毫米）= 0.945px

如何使用此轉換器

1. 選擇方向： pt → px 或 px → pt。
2. 輸入數值： 一個數字，或以逗號或空格分隔的完整字級比例（每次最多 20 個）。接受並忽略結尾單位，例如 12pt。
3. 設定輸出解析度： CSS 與網頁工作請維持 96 DPI，或點選 72、150、300 或 600 DPI 的按鈕。
4. 按一下「轉換」： 查看結果、DPI 比較、實際大小的字型預覽、毫米尺規和參考級距表。
5. 複製 CSS： 一個按鈕即可複製每個 font-size 宣告，並在註解中保留原始點數值。

常見問題

如何將 pt 轉換為 px？

將點數值乘以輸出解析度，再除以 72，因為一個點數是一英吋的七十二分之一。在網頁上解析度固定為 96 DPI，因此 px = pt × 1.3333。例如 12pt 是 16px。

12pt 是多少像素？

在 CSS 與任何瀏覽器中，12pt 恰好是 16px。在 300 DPI 的列印或影像檔案中，同樣的 12pt 文字高度為 50 像素；在 600 DPI 時為 100 像素，因為像素數會隨解析度縮放，而物理尺寸保持不變。

1pt 一定是 1.3333px 嗎？

在 CSS 中，它一律是 1.3333px，因為 CSS 規範將一英吋固定定義為 96 像素。但這不適用於點陣圖輸出：300 DPI 時一點數是 4.1667 個裝置像素，而 72 DPI 時一點數恰好是一個像素。

pt 和 px 有什麼差別？

點數是等於一英吋七十二分之一的物理排版單位，用於印刷、文書處理器和桌面出版。像素是顯示單位。在 CSS 中，像素同樣以一英吋九十六分之一的物理參考值為基準，因此這兩個單位在網頁上能以固定比例轉換，但在影像檔案中則不然。

我應該在 CSS 中使用 pt 還是 px？

螢幕樣式請使用 px 或 rem，並將 pt 保留給列印樣式表。點數是絕對物理單位，因此以 pt 設定的文字會忽略訪客的瀏覽器字型大小偏好。在 @media print 區塊中，pt 是自然的單位，因為輸出確實以英吋測量。

列印時應該使用多少 DPI？

300 DPI 是商業印刷和相片品質輸出的標準；150 DPI 適用於草稿和從遠處觀看的大型印刷品；600 DPI 則用於精細線稿和高階印刷工作。請將解析度欄位設為印表機或輸出對話框所要求的值。

為什麼螢幕上的 12pt 文字不是 12 點高？

點數大小描述的是字型的 em 方格，也就是字母繪製其上的設計格線，而不是任何單一字形的高度。大寫字高通常約為 em 大小的 70%，小寫 x 高度約為 50%，因此 12pt 大寫字母的高度大約是 8.4pt。

裝置像素比會改變 pt 到 px 的轉換嗎？

不會。在 2× 或 3× 顯示器上，瀏覽器仍會將 12pt 回報為 16 個 CSS 像素，然後使用 32 或 48 個硬體像素來呈現這 16 個 CSS 像素。CSS 像素是參考單位，因此樣式表中的數字永遠不會改變；額外的硬體像素只會讓相同大小看起來更清晰。

其他資源

• CSS 長度單位 - MDN
• 絕對長度 - W3C CSS Values