---
# System prepended metadata

title: CSS-RWD
tags: [RWD, CSS]

---

# 總覽
# rem
rem是相對單位
rem是相對於HTML字號
1rem = 1HTML字號大小

## flexible
官方網站
https://github.com/amfe/lib-flexible
引入方法
放在body標籤最下面
功能
實際上會動態調整HTML的font-size
簡單說是讓1rem = 10分之1視口寬度
## px計算
基準字號 = 視口寬度/10
rem尺寸 = px數值/基準字號
# vw和vh
vw:viewport width
1vw = 100分之1視口寬度
vh:viewport height
1vh = 100分之1視口寬度
## px計算
vw尺寸 = px數值/100分之1視口寬度
vh尺寸 = px數值/100分之1視口高度
## 警告
vw和vh不建議混用，因為會造成盒子變形