问为什么按钮上的em和px不同？

EN

em等于所讨论元素的字体大小。如果你的按钮的字体大小不同于16px，那么em也会不同。

您所查看的所有元素都必须将其字体大小设置为16px。这并不奇怪，因为这是许多浏览器的默认设置。

，我知道16px等于1em。

这是不对的。unil 1em并不对应于特定的像素值，它对应于元素当前字体的字符大小。

默认情况下，该按钮具有不同的字体。设置按钮的字体，它会得到你习惯的大小。

但是，如果希望大小为一定数量的像素，则应使用px单位而不是em。即使您指定了相同的字体系列和字体大小，em单位在浏览器和操作系统之间也可能略有不同。

其他人谈到了对em单位如何与像素相关的误解，但潜在的问题还没有得到充分解决。

我今天发布了关于同样问题的帖子，这是showdev的answered here。

本质上，按钮有一个“系统字体”应用于它，阻止它继承其父按钮的字体大小。据我所知，所有主流浏览器都会发生这种情况，这是“预期行为”。

要克服此问题，请在css中指定button标签(或仅特定按钮)应显式继承其字体大小：

button {
     font-size:inherit;
}

这将使它与您正在处理的其他元素一样对待em大小。当然，这也会改变文本的大小，这对你来说可能是问题，也可能不是问题。