相对于原始值调整字体大小

Question

是否可以相对于外部样式表中指定的原始值内联调整字体大小（或其他任何CSS值）？就像这样，小提琴中的第一段实际上是3em * 110% = 3.3em，而不是现在的1.1em。

p.a {
  font-size: 3em;
}

<p class="a" style="font-size: 110%">
  adjusted text
</p>
<p class="a">
  normal text
</p>

Answer 1

一个选项是使用calc来放大字体大小：

p.a {
  font-size: 3em;
}

<p class="a" style="font-size: calc(110% * 3)">
  adjusted text
</p>
<p class="a">
  normal text
</p>

第二个选项是将公共父元素的em字体大小值用作乘数，并将子元素的em字体大小值设置为1em = 100％，因此1.1em等于110％：

.parent {
  font-size: 3em;
}

p.a {
  font-size: 1em;
}

<div class="parent">
  <p class="a" style="font-size: 1.1em">
    adjusted text
  </p>
  <p class="a">
    normal text
  </p>
</div>