Matched Rule to Computed Style

A class rule matches one paragraph, then computed style explains the visible color and weight.

Program

The second diagnostic ladder follows one CSS rule from source, through rule matching, into computed style, and finally into visible text.

matched_rule_computed_style.html

<style>
.notice { color: #0f766e; font-weight: 700; }
</style>
<p class="notice">Saved locally</p>

matched rule A matched rule is a CSS selector that applies to the selected element.

computed style Computed style is the resolved value the browser will use for painting.