用PX還是PT?(一)

印刷排版裡,PT(point)為「絕對」長度單位(device-dependent),將字體看作一個方塊,以方塊高度來定義其大小,是物理上的單位。


而螢幕字型單位PX(pixer)則為「相對」長度單位(device-independent),「相對」則表示此字型會隨使用者瀏覽器大小.系統平台或顯示器所預設的像素密度(dpi 值) ....等因素而改變。


簡單說,用途在螢幕上時,盡量使用PX(pixer)
列印文件則請使用PT(point)


因PX本為螢幕用字型單位。
PT則為印刷用字體單位。


兩者換算公式 pt ＝ pt ÷72 ×像素密度(dpi /ppi值) ＝ px(四捨五入)
範例: 9pt= 9pt ÷72×96(dpi/ppi)= 12px
暫時的結論: 將字體設定為9pt與12px在銀幕上顯示是一樣大小
像素密度(dpi/ppi值/screen resolution)早期為72 dpi˙現多改以96 dpi計算


以上只為簡單原理說明,仍有其他因素影響著pt與px的大小顯示
例如:像素密度(dpi 值)則是公式裡需一提因素,此會隨螢幕顯示技術.系統平台預設(dpi /ppi值)...而改變影響。


在網頁設計時,該使用PX還是PT並無絕對定見,但PX相較起PT,仍為較被認可的主流單位!
除非特殊考量,建議採用相對單位做設計,因瀏覽者不會使用相同螢幕顯示與系統平台瀏覽網頁,相對單位除了PX還有常被使用的em %。


也有些錯誤觀念認為PT可以固定住大小,這並非正確。
雖然,在像素密度(dpi/ppi值)不同環境下,pt仍能維持固定「大小」。但就排版上而言,pt仍帶來差異,因而出現斷行.破版的狀況。所以造成px與pt整體顯示差異的因素不只考量「字體看起來的大小」,更要考慮字間排列所帶來之整體差異,才能完整掌控畫面Layout,這並非單單使用pt就能解決的。另外,css裡絕對長度單位(absolute length unit)的概念,是相對於輸出裝置(output device)而言的。





分享本篇文章