css - 什么是指定值、计算值和实际值？

Question

英语不是我的第一语言，所以我发现很难从 MDN 中学习。

我认为从我读到的指定值是在样式表中指定的样式或从父元素继承的样式。

我真的不知道什么是计算值

实际值是实际使用的值

Answer 1

看起来好像这些值都是一样的；即指定值、计算值和实际值都是 1px，你看不出任何差异，你想知道为什么有那么多短语来描述同一件事!
因此，也许一些示例会说明这一点。

指定值 是您指定的任何值。例如，如果您在样式表中编写 p {font-size:2rem;，那么 p 的指定值显然是 2rem。

然后浏览器计算以像素为单位的内容，即(至少如果 1rem 为 16px)32px。这是用于显示的计算值(因此它也是使用值，在大多数情况下也是实际值)。

但是，有些情况下 32px 是不可能的。例如，如果此特定字体是位图字体，并且 32px 版本不可用。如果只有 30px 版本，那么这就是实际显示在显示器上的实际值。

使用值 也可以不同于计算值。例如，如果你有 p {width:600px; max-width:400px; 在你的样式表中，那么计算值仍将是 600px，但是使用值 (因此实际值)将为400px。

希望这对您有所帮助。如果您需要更多示例，请询问。