<div class="selection">
<span class="myspan">Selam</span>
</div>
.selection{
width:200px;
font-size:18px;
}
.myspan{
font-size:220%;
display:block;
width: 50%;
}
我有上面的HTML和CSS。我的问题是：当执行 Css 解析时，字体大小(myspan(的"计算值"是 50% 还是 39.6px？
你的问题有点令人困惑，但我会尽量把细节说清楚，因为我认为你在问。
首先，我认为你的意思是"计算"值而不是"计算"值。您还在评论中询问了"已使用"值，为了全面了解，我们还需要涵盖其他一些值，即"指定"值、"已解决"值和"实际"值。
现在先拿font-size，我们有 .myspan 元素
- 指定值 = 220%
- 计算值 = 18px * 220% = 39.6px
- 解析值 = 39.6px
(font-size的解析值是计算值( - 已用值 = 39.6px
(始终与font-size的计算值相同( - 实际值 = 约 39-40px
(CSS像素将转换为设备像素，可以根据可用字体进行其他一些近似值，并使用设备上最接近的可渲染数字(
对于width，事情的工作方式略有不同
- 指定值 = 50%
- 计算值 = 50%
(在计算值时不知道像素长度，因为此步骤中尚未发生布局( - 使用值 = 200px * 50% = 100px
(布局完成，像素值确定( - 解析值 = 100px
(width的解析值是使用的值( - 实际值 = 约 100px
(与字体大小一样，CSS 像素将转换为设备像素，并使用设备上最接近的可渲染数字(
现在，引起混淆的是，当您在 JavaScript 中使用getComputedStyle()或检查浏览器开发人员工具中的"计算值"选项卡时，您不会获得元素的"计算"值 - 您将获得元素的"已解决">值。
对于getComputedStyle()来说，这只是出于向后兼容性原因而存在的历史异常。为什么开发人员工具也报告"已解决"值，我不知道。
计算值将是父字体大小乘以您在元素上指定的百分比 (18px * 220%(。在本例中：39.6px。像这样使用百分比与在子元素上设置font-size: 2.2em基本相同。
宽度也将应用相同的计算，结果为 100px。