[分享]css中1em等于18像素么

在 CSS 中，1em 等于多少像素一直是一个让人困惑的问题，主要是因为 em 和像素的关系是相对的。事实上，1 em 并不等于固定的像素数，而是与当前字体设置有关。p { fontsize: 16p...

在 CSS 中，1em 等于多少像素一直是一个让人困惑的问题，主要是因为 em 和像素的关系是相对的。事实上，1 em 并不等于固定的像素数，而是与当前字体设置有关。

p {
  font-size: 16px;
  line-height: 1.5em;
} 

在上面的代码示例中，如果 p 元素的字体大小设置为 16px，那么 1.5em 就相当于 24px（16*1.5=24）。但是如果字体大小被更改为 18px，1.5em 就变成了 27px（18*1.5=27）。因此，em 的大小与字体大小成比例。

此外，em 的使用方式在响应式设计中非常有用。例如，如果您将一个元素的宽度设置为 50em，当用户在窄屏幕上查看页面时，元素的宽度将自动缩小为 50个“M”字体宽度，而不是固定的像素数。

.container {
  width: 50em;
} 

在总结中，1em 并不等于固定的像素数，而是与设置的字体大小相关。使用 em 作为 CSS 中的度量单位可以帮助实现响应式设计，并且能够根据不同的字体大小进行缩放。