尺寸單位(CSS)
速算:100%=1em=1rem=16px=12pt
螢幕內容列印時的單位轉換:Pixel→inch→dot
螢幕內容顯示時的單位轉換:相對單位→px→(ppi)→inch→絕對單位
1inch=2.54cm=25.4mm=72pt=6pc
單位值、表達式和特殊值可混用
例如grid-template-columns: 1fr min-content minmax(100px, max-content);
單位值
smallest viewport
largest viewport
dynamic viewport
相對於容器元素width的比例,1cqw=1%
cqh
相對於容器元素height的比例,1cqh=1%
cqi
相對於容器元素inline尺寸的比例,1cqi=1%
cqb
相對於容器元素block尺寸的比例,1cqb=1%
cqmin
取容器元素的inline與block尺寸
cqmax
表達式
計算式中的值
式中最大的值
式中最小的值
指定最小值、基礎值、最大值
font-size: clamp(16px, 5vw, 20px);
特殊值
取得容器最大尺寸的空間,當成填充條件
取得容器最小尺寸的空間,當成填充條件
自動設定空間尺寸
設定為與子元素的寬度相同