Css 仅为特定div内的所有元素重置rem或字体大小

我有一个典型的HTML结构，如下面的代码所示

<div class="common-parent">
  <div class="parent>
    <div class="child">
      <h2>Child 1</h2>
      <span>Some text here...</span>
    </div>
    <div class="new-child">
      <h2>New Child</h2>
      <div>
        <span>Some text here...</span>
      </div>            
    </div>
  </div>
</div>

CSS长度单位'rem'表示'Root EM'，它始终取决于根元素
。因此，如果您希望根据特定父元素的字体大小设置确定字体大小，可以使用其他单位，如em或百分比。
只需使用像素测量值“重置”基本
字体大小即可：

.common-parent div.parent{
    font-size: 12px;
}

然后，
.common parent div.parent
中包含的每个元素将读取
1em
为
12px

注意：通常情况下，你不应该将像素单位与
em
s混合，但对于重置基本字体大小，这是一个合理的解决方案。
我认为OP和其他像我一样发现这一点的人希望有一些CSS功能来“重新根”
rem
单位。尽管这不是我们想要听到的，但在这个时候，这个答案仍然是正确的。