# Front-end: CSS 單位總表

### CSS 單位

- `vh`：視窗的高度，也就是眼睛看到螢幕的高度。如果螢幕的解析度是 1920x1080。那麼 `1vh` 的高度就是 1080px。
- `vw`：與 `vh` 相對，視窗的寬度。所以相對的 `1vw` 寬度就是 1080px。
- %：百分比，但是要注意的是這邊百分比是以 parent element 為基準。如果 parent element 沒有設定寬高，那百分比就會無效。
- `rem`：根據 root element 來變化大小。如果 root element 設定 `10px`，那 `1rem = 10px`。
- `px`：固定的像素點。
- `calc`：計算函數，可以計算當前的值，然後才賦值 `height: calc(~'100% - 7.4rem - 10px')`。