如何修复 css 中 `em` 比例的相对性？

Question

由于em长度比例是相对于当前字体大小的，所以出现了这个问题。

我希望很多元素的 border-width 是我正常字体宽度的八分之一。正常情况下，我的意思是当 html 文档具有最少的必要部分并且只有用我的字体编写的文本时。我的字体是单声道的。

你可以看看它的样子：

当我只写 border-width: 0.125em; 时，边框的宽度不会相同。

我不想使用 px 因为我想在非常紧凑的显示器上产生相同的宽度。

我该怎么办？

Answer 1

您可以使用 calc(1rem / 8) 得到 1rem 的 1/8 或使用 0.125rem。使用 rem 将引用文档的基本字体大小，而不是整个文档中的任何 em。

div {
  font-family: monospace;
  border: 0.125rem solid black;
}

<div>foo</div>