【发布时间】：2016-04-15 05:05:20
【问题描述】：
【问题讨论】：
-
Kayce Basques 来自 Google 添加了此 document computed properties in devtools 和 updated the doc to cover grey entries
标签： css google-chrome google-chrome-devtools
【发布时间】：2016-04-15 05:05:20
【问题描述】：
注意：这个答案没有确凿的证据，它是基于我一直以来的观察。
灰色计算属性既不默认，也不继承。这仅发生在未为元素定义的属性上，而是根据运行时布局渲染从其子元素或父元素计算得出的。
以这个简单的页面为例，display是默认的，font-size是继承的：
<style>
div { font-size: 13px; }
</style>
<div>
<p>asdf</p>
</div>
在这个特定的例子中，height 是根据 <p> 的子节点 - 文本节点（字体大小加上行高）计算得出的，width 是根据其父节点 - <div> 的宽度计算得出的，这也是从其父 <body> 计算。
编辑：好吧，我又想了想，这是我的基于意见的答案。以后我真的应该去看看 Chromium 源代码 :D
通过展开这些箭头，您可以看到在针对它定义的所有规则（直接或继承，由开发人员或浏览器）中应用于元素的实际规则：
您可以在此处追溯每个定义，甚至包括浏览器内置规则，并检查 CSS 级联（覆盖）机制。
因此，对于那些没有 CSS 定义（没有直接定义、没有继承、没有内置浏览器）的元素，您没有任何来源可追踪。并且属性值完全是运行时计算的。
如果您选中全部显示，则会显示更多灰色属性。这些也没有在任何地方定义。但与之前的截图不同，这些是不是运行时计算的 - 它们是 CSS 规范的默认值。
【讨论】：
-
这是有道理的。另一个细节：无法像其他属性一样单击灰色属性，以在特定声明中显示其值的来源。
-
@AmbroseChapel 我再次思考并更新了我的答案。我真的应该去阅读源代码。好问题。
-
灰色属性是
run-time calculated当然是有道理的，因为灰色属性通常是“高度”和“宽度”，如果你考虑一下，它们是动态依赖于元素的子元素的值（例如，元素中包含的文本的数量和字体大小，或者当元素具有宽度时父级的宽度：100%） -
一个很好的 CDT 特性是：查看值是如何计算的，意味着：例如，哪些元素加起来是
width样式。