add :heading, :heading() pseudo classes (#11836)

Author: keithamus

selectors-5/Overview.bs

@@ -16,6 +16,7 @@ Abstract: Selectors Level 5 describes the selectors that already exist in [[!sel
 <pre class="link-defaults">
 spec:selectors-4; type:dfn; text:selector
 spec:html; type:dfn; text:states set
+spec:html; type:dfn; text:heading level
 </pre>
 
 <h2 id="intro">
@@ -154,6 +155,37 @@ Exposing custom state: the '':state()'' pseudo-class</h2>
 	see <a href="https://html.spec.whatwg.org/multipage/custom-elements.html#custom-state-pseudo-class">HTML's definition</a> for more detail.
 	Other host languages must define how this pseudo-class matches.
 
+<h2 id="headings">
+Heading Structures: the heading pseudo-classes '':heading'', and '':heading()''</h2>
+
+	The (non-functional) <dfn id='heading-pseudo'>:heading</dfn> pseudo-class
+	matches an element which has a <a>heading level</a>, with respect to the
+	semantics defined by the document language (e.g. [[HTML5]]).
+
+	<div class="example">
+		For example, the following sheet contains a rule applying to all heading
+		elements in the current page:
+
+		<pre>:heading { text-decoration: underline; }</pre>
+	</div>
+
+	As a functional pseudo-class,
+	<dfn id='heading-functional-pseudo' lt=':heading()'>:heading(<var>An+B</var>)</dfn>
+	notation represents elements that have a <a>heading level</a> among <var>An+B</var>.
+
+	<div class="example">
+		The following example styles headings with levels between 1 and 3 with a
+		font-weight of 900, while headings with levels 6 onward with font-weight of
+		500:
+
+		<pre>:heading(-n+3) { font-weight: 900; }</pre>
+		<pre>:heading(n+6) { font-weight: 500; }</pre>
+	</div>
+
+	Note: The <a>heading level</a> might be different from an element's
+	<a>type selector</a>. Thus, a selector ''h1:heading(3)'' matches any
+	''h1'' tag which has an exposed heading level of 3.
+
 <h2 id="combinators">
 Combinators</h2>
 
@@ -202,6 +234,7 @@ Changes Since Level 4</h3>
 	        <li>The functional form of the '':local-link'' pseudo-class
 	        (deferred from an <a href="https://www.w3.org/TR/2013/WD-selectors4-20130502/">earlier draft</a> of Selectors 4)</li>
 	        <li>The '':state()'' pseudo-class</li>
+	        <li>The '':heading'' and '':heading()'' pseudo-classes</li>
 	</ul>
 
 <h2 id="acknowledgements">