E=mc² 的日常: CSS單位在RWD上的應用、Pt 轉 Px 快速轉換表

CSS有幾種表示長度的不同單位

許多CSS屬性採取“長度”的值，例如width，margin，padding， font-size，等。

長度是一個數字，後跟一個長度單位，例如10px，2em等。

數字和單位之間不能出現空格。但是，如果值為0，則可以省略單位。

對於某些CSS屬性，允許使用負數長度。

長度單位有兩種：絕對單位和相對單位。

絕對長度

絕對長度單位是固定的，用任何一個長度表示的長度將恰好與該大小相同。

不建議在螢幕上使用絕對長度單位，因為螢幕尺寸變化很大。但是，如果已知固定尺寸，則可以使用，例如用於Print Layout。

*像素（px）相對於查看設備。對於低dpi的設備，1px是顯示器的一個設備像素（點）。對於打印機和高分辨率屏幕，1px表示多個設備像素。

相對長度 對長度單位指定相對於另一個長度屬性的長度。相對長度單位在不同渲染介質之間縮放更好。

另外，在ps裡做設計稿時，常常需要單位pt轉px、或是ems轉px等相關數值

可利用以下網頁，直接幫你轉換非常方便

https://simplecss.eu/pxtoems.html

Pt to Px Converter

Simple CSS Units is a free tool for Web Designers & Front End Developers to simplify the process of converting CSS units. Simply enter your units in the fields below and watch your unit get converted in realtime, eg Points to Pixels.