Chrome DevToolsが計算されたプロパティをグレー表示するとはどういう意味ですか

Question 1

してくださいノート、ないスタイルパネル（私はグレー表示どのように適用文脈ないで手段を知っている）が、オーバー次のパネル、計算結果のプロパティパネル。

Computedプロパティがグレー表示されているとはどういう意味ですか？

例：

Question 2

注意：この回答には確固たる証拠はありません。これは、長年にわたる私の観察に基づいています。

灰色の計算されたプロパティは、どちらもデフォルトで、も継承されました。これは、要素に対して定義されていないが、ランタイムレイアウトレンダリングに基づいてその子または親から計算されたプロパティでのみ発生します。

この単純なページを例にとると、displayデフォルトでfont-sizeあり、継承されます。

<style>
  div { font-size: 13px; }
</style>
<div>
  <p>asdf</p>
</div>

この特定の例でheightは、はの子から計算され<p>ます-テキストノード（フォントサイズと行の高さ）widthは、親から計算されます-<div>の幅は、親からも計算されます<body>。

編集：まあ、私はもう一度考えました、これが私の意見に基づいた答えです。後でChromiumのソースコードを実際に見てみる必要があります：D

これらの矢印を展開すると、要素に対して定義されたすべてのルールの中で、要素に適用されている実際のルールを確認できます（直接または継承され、開発者またはブラウザーによって）。

ここでは、ブラウザーの組み込みルールを含むすべての定義までたどり着き、CSSカスケード（オーバーライド）メカニズムを確認できます。

したがって、CSS定義がない（直接定義されていない、継承されていない、ブラウザーが組み込まれていない）要素の場合、トレースするソースはありません。また、プロパティ値は完全に実行時に計算されます。

[すべて表示]をオンにすると、さらに灰色のプロパティが表示されます。これらもどこにも定義されていません。ただし、前のスクリーンショットとは異なり、これらは実行時に計算されません。CSS仕様のデフォルト値です。