🔢 px/rem 转换器

像素和rem单位轻松互转

Ad Space

像素 (px)

px

Rem

rem

⚙️ 配置选项

1
rem
16px ÷ 16 = 1rem

📊 常用尺寸对照表

px rem (16px基准) em (16px基准)
Ad Space

Frequently Asked Questions

什么是rem单位?
rem(Root Em)是CSS中相对于根元素(html)字体大小的单位。如果根字号是16px,那么1rem = 16px,0.5rem = 8px。与em不同,rem始终相对于根字号计算,避免了嵌套元素字体大小叠加的问题。
为什么建议使用rem而不是px?
使用rem的优势:1) 便于响应式设计,通过改变根字号即可统一调整所有尺寸;2) 便于无障碍访问,用户可以调整浏览器默认字号;3) 保持比例一致性,避免嵌套元素的尺寸叠加。
根字号默认是多少?
大多数浏览器的默认根字号是16px。这也是为什么16px被认为是最佳实践。如果你的设计稿是基于16px的,那么1:1转换会很方便。
如何根据设计稿计算rem?
公式:rem = 设计稿像素 / 根字号。例如设计稿是750px宽度,某个元素是75px,在16px根字号下,rem = 75 / 16 ≈ 4.6875rem。使用本工具可以快速完成这个计算。
rem和em有什么区别?
rem始终相对于根元素(html)计算,而em相对于当前元素的父元素计算。如果你在一个1.5em字体大小的父元素中,子元素的1em会等于父元素的字体大小,而不是根字号。这导致嵌套时计算复杂,而rem始终一致。