DEV Community
·
使用em和rem进行尺寸设置
💡
原文英文，约800词，阅读约需3分钟。
📝
内容提要
"em"是相对单位，基于大写字母M的像素大小（默认16px），用于设置字体和边距等。虽然"em"可以实现灵活布局和无障碍访问，但可能导致计算复杂性和累积效应。为避免这些问题，可以使用"rem"单位，它始终相对于根元素的字体大小。
🎯
关键要点
- "em"是相对单位，基于大写字母M的像素大小（默认16px）。
- "em"单位用于设置字体、边距等，适用于灵活布局和无障碍访问。
- "em"的计算可能复杂，存在累积效应。
- 使用"rem"单位可以避免"em"的累积效应，它始终相对于根元素的字体大小。
- 在CSS中，"em"单位可以用于设置长度单位，如填充、边距和字体大小。
- 使用"em"单位可以实现无缝缩放，提升可访问性。
- "em"单位的计算可能会导致性能问题，特别是在复杂的CSS计算中。
- 改变父元素的字体大小会影响子元素的"em"值，可能导致意外的字体大小。
- 使用"rem"单位可以确保字体大小相对于根元素，避免了"em"的累积效应。
➡️
