답변
NB :이 답변은 확실한 증거가 없으며 시간에 따른 내 관찰을 기반으로합니다.
회색 계산 된 속성은 도 기본적으로 도 물려 받았다. 이는 요소에 대해 정의되지 않았지만 런타임 레이아웃 렌더링을 기반으로 하위 또는 상위에서 계산 된 속성에서만 발생합니다.
이 간단한 페이지를 예로 들면 display
기본값이며 font-size
상속됩니다.
<style>
div { font-size: 13px; }
</style>
<div>
<p>asdf</p>
</div>
이 특정 예에서, height
계산된다 <p>
의 아이 – 텍스트 노드 (폰트 크기를 더한 라인 높이)를, width
그 부모로부터 산출 – <div>
‘또한 부모로부터 계산의 폭을 <body>
.
편집 : 글쎄요, 다시 생각했습니다. 여기에 내 의견 기반 답변이 있습니다. 나는 정말로 가서 나중에 Chromium 소스 코드를 살펴 봐야한다. : D
이러한 화살표를 확장하면 요소에 대해 정의 된 모든 규칙 (개발자 또는 브라우저에 의해 직접 또는 상 속됨) 중에서 요소에 적용된 실제 규칙을 확인할 수 있습니다.
여기에서 브라우저 내장 규칙을 포함하여 모든 정의를 추적 할 수 있으며 CSS 계단식 (재정의) 메커니즘으로 확인할 수 있습니다.
따라서 CSS 정의가없는 요소의 경우 (직접 정의되지 않고 상속되지 않으며 브라우저가 내장되지 않음) 추적 할 소스가 없습니다. 그리고 속성 값은 완전히 런타임 계산됩니다.
당신이 선택하면 모두 표시 , 더 회색 속성이 표시됩니다. 이것들은 어디에도 정의되어 있지 않습니다. 그러나 이전 스크린 샷과 달리 이는 런타임 계산 이 아니라 CSS 사양 기본값입니다.