Question

当前正处于构建新网站的最后阶段，并且最近运行了辅助功能检查器。检查人员建议将我的字体大小从px更改为em。但是，当我进行直接转换（从16px到1em）时，字体会变得很小。我想念什么吗？

这是我的风格。

.bodyText {font-size: 16px !important; padding-top: 10px; margin-bottom: 20px;}
.bodyText a {color: #008080 !important; text-decoration: underline;}
.bodyText a:hover {color: #008080 !important;}
.bodyText li {font-size: 16px !important; color: #686868;}
.bodyText p {font-size: 16px !important; color: #686868;}
.bodyText p strong {color: #333333;}

所有这些都位于附着了它的身体中。

body {font-size: 16px !important; font-family: "Source Sans Pro", sans-serif !important; font-style: normal; font-weight: normal;}
tbody {font-size: 16px !important; font-family: "Source Sans Pro", sans-serif !important; font-style: normal; font-weight: normal;}

Answer 1

首先我要说的是，EM是在本地使用的，而REM是在全球使用的。

Rem使用html标签的font-size，因此，如果：

html {
  font-size: 16px;
}

然后1 rem等于16px

另一方面，当您使用em时，您需要了解上下文，这意味着如果文本元素的父容器得到font-size: 12px，则1em变为12px

您可以在此处了解更多信息：https://j.eremy.net/confused-about-rem-and-em/

Answer 2

所以em不是像px这样的大小。 em表示项目上设置的当前字体大小，

如果...

p {
  font-size: 16px;
}

然后，当您将em添加到某个特定的片段中时，例如说您拥有

<p class="em-class">Hello World</p>
<style>
.em-class {
 font-size: 2em;
 }
</style>

然后该类的字体大小将为32px。它实际上是当前字体大小的百分比

将px转换为em-文本变得比原来的小

2 个答案: