CSS 单位转换
在线 CSS 单位转换工具,支持 px、rem、em、vw、vh、% 等单位互转绝对单位:
- px (像素):屏幕上的物理像素点,最常用的单位
- pt (点):1/72英寸,主要用于印刷
- pc (派卡):12点,等于1/6英寸
- in (英寸):物理英寸单位
- cm (厘米):物理厘米单位
- mm (毫米):物理毫米单位
相对单位:
- rem:相对于HTML根元素字体大小,推荐用于响应式设计
- em:相对于父元素字体大小,可能产生累积效应
- vw:视口宽度的1%,适合全屏布局
- vh:视口高度的1%,适合全屏布局
- vmin:vw和vh中的较小值
- vmax:vw和vh中的较大值
- %:相对于父元素的百分比
使用建议:
- 字体大小:推荐使用 rem,便于全局控制
- 边距内边距:可使用 rem 或 em
- 宽度高度:根据需求选择 px、rem、vw、%
- 全屏元素:推荐使用 vw、vh
- 响应式设计:结合使用 rem 和 vw/vh
换算关系:
- 1in = 96px (在96dpi下)
- 1in = 72pt
- 1in = 6pc
- 1in = 2.54cm
- 1pt = 1.333px
- 1pc = 12pt = 16px