網頁

2013年4月18日

[css] 尺寸單位(px, em, ex, in, cm, mm, pt, pc)說明

css有8種(px, em, ex, in, cm, mm, pt, pc)單位可以使用,在呈現上區分(relative)相對單位及(absolute)絕對單位,適用對象及使用時機還有點複雜,但是只要是螢幕顯示的,相對及絕對單位都可以使用。


相對單位及絕對單位的差異,個人理解如下:
相對單位:隨著螢幕解析度像素及瀏覽器的設定,呈現相對大小,常用於螢幕顯示。
  • em 字體大小(適用文字)
  • ex 字體高度(適用文字)
  • px 像素

絕對單位:相對單位的相反,顯示比例不受解析度及瀏覽器設定影響,一般要列印的資料都會用絕對單位。
  • in 英寸
  • cm 公分
  • mm 公厘
  • pt 點(points)
  • pc PostScript picas
單位換算:1in(英寸) = 2.54cm(公分) = 25.4mm(公厘) = 72pt(點) = 6pc