Skip to content

Commit 7ef2fad

Browse files
tabatkinstabatkins
committed
[selectors] Per WG resolution, define a :blank pseudo that is just like :empty, but ignores collapsible whitespace.
1 parent 53a057f commit 7ef2fad

2 files changed

Lines changed: 77 additions & 30 deletions

File tree

‎selectors/Overview.html‎

Lines changed: 63 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -396,51 +396,54 @@ <h2 class="no-num no-toc" id=contents>Table of Contents</h2>
396396
<li><a href="#the-empty-pseudo"><span class=secno>12.2. </span>
397397
<code>:empty</code> pseudo-class</a>
398398

399-
<li><a href="#child-index"><span class=secno>12.3. </span> Child-indexed
399+
<li><a href="#the-blank-pseudo"><span class=secno>12.3. </span>
400+
<code>:blank</code> pseudo-class</a>
401+
402+
<li><a href="#child-index"><span class=secno>12.4. </span> Child-indexed
400403
Pseudo-classes</a>
401404
<ul class=toc>
402-
<li><a href="#the-nth-child-pseudo"><span class=secno>12.3.1. </span>
405+
<li><a href="#the-nth-child-pseudo"><span class=secno>12.4.1. </span>
403406
<code>:nth-child()</code> pseudo-class</a>
404407

405-
<li><a href="#the-nth-last-child-pseudo"><span class=secno>12.3.2.
408+
<li><a href="#the-nth-last-child-pseudo"><span class=secno>12.4.2.
406409
</span> <code>:nth-last-child()</code> pseudo-class</a>
407410

408-
<li><a href="#the-first-child-pseudo"><span class=secno>12.3.3.
411+
<li><a href="#the-first-child-pseudo"><span class=secno>12.4.3.
409412
</span> <code>:first-child</code> pseudo-class</a>
410413

411-
<li><a href="#the-last-child-pseudo"><span class=secno>12.3.4. </span>
414+
<li><a href="#the-last-child-pseudo"><span class=secno>12.4.4. </span>
412415
<code>:last-child</code> pseudo-class</a>
413416

414-
<li><a href="#the-only-child-pseudo"><span class=secno>12.3.5. </span>
417+
<li><a href="#the-only-child-pseudo"><span class=secno>12.4.5. </span>
415418
<code>:only-child</code> pseudo-class</a>
416419
</ul>
417420

418-
<li><a href="#typed-child-index"><span class=secno>12.4. </span> Typed
421+
<li><a href="#typed-child-index"><span class=secno>12.5. </span> Typed
419422
Child-indexed Pseudo-classes</a>
420423
<ul class=toc>
421-
<li><a href="#the-nth-of-type-pseudo"><span class=secno>12.4.1.
424+
<li><a href="#the-nth-of-type-pseudo"><span class=secno>12.5.1.
422425
</span> <code>:nth-of-type()</code> pseudo-class</a>
423426

424-
<li><a href="#the-nth-last-of-type-pseudo"><span class=secno>12.4.2.
427+
<li><a href="#the-nth-last-of-type-pseudo"><span class=secno>12.5.2.
425428
</span> <code>:nth-last-of-type()</code> pseudo-class</a>
426429

427-
<li><a href="#the-first-of-type-pseudo"><span class=secno>12.4.3.
430+
<li><a href="#the-first-of-type-pseudo"><span class=secno>12.5.3.
428431
</span> <code>:first-of-type</code> pseudo-class</a>
429432

430-
<li><a href="#the-last-of-type-pseudo"><span class=secno>12.4.4.
433+
<li><a href="#the-last-of-type-pseudo"><span class=secno>12.5.4.
431434
</span> <code>:last-of-type</code> pseudo-class</a>
432435

433-
<li><a href="#the-only-of-type-pseudo"><span class=secno>12.4.5.
436+
<li><a href="#the-only-of-type-pseudo"><span class=secno>12.5.5.
434437
</span> <code>:only-of-type</code> pseudo-class</a>
435438
</ul>
436439

437-
<li><a href="#selected-child-index"><span class=secno>12.5. </span>
440+
<li><a href="#selected-child-index"><span class=secno>12.6. </span>
438441
Selected Child-indexed Pseudo-classes</a>
439442
<ul class=toc>
440-
<li><a href="#the-nth-match-pseudo"><span class=secno>12.5.1. </span>
443+
<li><a href="#the-nth-match-pseudo"><span class=secno>12.6.1. </span>
441444
<code>:nth-match()</code> pseudo-class</a>
442445

443-
<li><a href="#the-nth-last-match-pseudo"><span class=secno>12.5.2.
446+
<li><a href="#the-nth-last-match-pseudo"><span class=secno>12.6.2.
444447
</span> <code>:nth-last-match()</code> pseudo-class</a>
445448
</ul>
446449
</ul>
@@ -3174,14 +3177,34 @@ <h3 id=the-empty-pseudo><span class=secno>12.2. </span> <a
31743177
<pre>&lt;foo>this is not &lt;bar>:empty&lt;/bar>&lt;/foo></pre>
31753178
</div>
31763179

3177-
<h3 id=child-index><span class=secno>12.3. </span> Child-indexed
3180+
<h3 id=the-blank-pseudo><span class=secno>12.3. </span> <a
3181+
href="#blank-pseudo"><code>:blank</code></a> pseudo-class</h3>
3182+
3183+
<p>The <dfn id=blank-pseudo>:blank</dfn> pseudo-class is identical to the
3184+
<a href="#empty-pseudo"><code>:empty</code></a> pseudo-class, except that
3185+
it additionally excludes <a
3186+
href="http://www.w3.org/TR/css3-text/#white-space-processing">characters
3187+
subject to whitespace processing</a> <a href="#CSS3TEXT"
3188+
rel=biblioentry>[CSS3TEXT]<!--{{!CSS3TEXT}}--></a> when determining
3189+
whether an element is empty.
3190+
3191+
<div class=example>
3192+
<p>For example, the following element matches <a
3193+
href="#blank-pseudo"><code>:blank</code></a>, but not <a
3194+
href="#empty-pseudo"><code>:empty</code></a>, because it contains at
3195+
least one linebreak, and possibly other whitespace:
3196+
3197+
<pre>&lt;p><br>&lt;/p></pre>
3198+
</div>
3199+
3200+
<h3 id=child-index><span class=secno>12.4. </span> Child-indexed
31783201
Pseudo-classes</h3>
31793202

31803203
<p> The pseudo-classes defined in this section select elements based on
31813204
their index in their parent's list of children (or, if they have no
31823205
parent, by their index in the list of them and their siblings).
31833206

3184-
<h4 id=the-nth-child-pseudo><span class=secno>12.3.1. </span> <a
3207+
<h4 id=the-nth-child-pseudo><span class=secno>12.4.1. </span> <a
31853208
href="#nth-child-pseudo"><code>:nth-child()</code></a> pseudo-class</h4>
31863209

31873210
<p>The <dfn id=nth-child-pseudo
@@ -3349,7 +3372,7 @@ <h4 id=the-nth-child-pseudo><span class=secno>12.3.1. </span> <a
33493372
<pre>html|tr:nth-child(-n+6) /* represents the 6 first rows of XHTML tables */</pre>
33503373
</div>
33513374

3352-
<h4 id=the-nth-last-child-pseudo><span class=secno>12.3.2. </span> <a
3375+
<h4 id=the-nth-last-child-pseudo><span class=secno>12.4.2. </span> <a
33533376
href="#nth-last-child-pseudo"><code>:nth-last-child()</code></a>
33543377
pseudo-class</h4>
33553378

@@ -3377,7 +3400,7 @@ <h4 id=the-nth-last-child-pseudo><span class=secno>12.3.2. </span> <a
33773400
--> counting from the last one */</pre>
33783401
</div>
33793402

3380-
<h4 id=the-first-child-pseudo><span class=secno>12.3.3. </span> <a
3403+
<h4 id=the-first-child-pseudo><span class=secno>12.4.3. </span> <a
33813404
href="#first-child-pseudo"><code>:first-child</code></a> pseudo-class</h4>
33823405

33833406
<p>Same as <code>:nth-child(1)</code>. The <dfn
@@ -3423,7 +3446,7 @@ <h4 id=the-first-child-pseudo><span class=secno>12.3.3. </span> <a
34233446
-->a:first-child /* Same (assuming a is not the root element) */</pre>
34243447
</div>
34253448

3426-
<h4 id=the-last-child-pseudo><span class=secno>12.3.4. </span> <a
3449+
<h4 id=the-last-child-pseudo><span class=secno>12.4.4. </span> <a
34273450
href="#last-child-pseudo"><code>:last-child</code></a> pseudo-class</h4>
34283451

34293452
<p>Same as <code>:nth-last-child(1)</code>. The <dfn
@@ -3439,7 +3462,7 @@ <h4 id=the-last-child-pseudo><span class=secno>12.3.4. </span> <a
34393462
<pre>ol > li:last-child</pre>
34403463
</div>
34413464

3442-
<h4 id=the-only-child-pseudo><span class=secno>12.3.5. </span> <a
3465+
<h4 id=the-only-child-pseudo><span class=secno>12.4.5. </span> <a
34433466
href="#only-child-pseudo"><code>:only-child</code></a> pseudo-class</h4>
34443467

34453468
<p>The <dfn id=only-child-pseudo>:only-child</dfn> pseudo-class represents
@@ -3448,15 +3471,15 @@ <h4 id=the-only-child-pseudo><span class=secno>12.3.5. </span> <a
34483471
<code>:nth-child(1):nth-last-child(1)</code>, but with a lower
34493472
specificity.
34503473

3451-
<h3 id=typed-child-index><span class=secno>12.4. </span> Typed
3474+
<h3 id=typed-child-index><span class=secno>12.5. </span> Typed
34523475
Child-indexed Pseudo-classes</h3>
34533476

34543477
<p> The pseudo-elements in this section are similar to the <a
34553478
href="#child-index">Child Index Pseudo-classes</a>, but they resolve based
34563479
on an element's index <em>among elements of the same type (tagname)</em>
34573480
in the child list.
34583481

3459-
<h4 id=the-nth-of-type-pseudo><span class=secno>12.4.1. </span> <a
3482+
<h4 id=the-nth-of-type-pseudo><span class=secno>12.5.1. </span> <a
34603483
href="#nth-of-type-pseudo"><code>:nth-of-type()</code></a> pseudo-class</h4>
34613484

34623485
<p>The <dfn id=nth-of-type-pseudo
@@ -3482,7 +3505,7 @@ <h4 id=the-nth-of-type-pseudo><span class=secno>12.4.1. </span> <a
34823505
-->img:nth-of-type(2n) { float: left; }</pre>
34833506
</div>
34843507

3485-
<h4 id=the-nth-last-of-type-pseudo><span class=secno>12.4.2. </span> <a
3508+
<h4 id=the-nth-last-of-type-pseudo><span class=secno>12.5.2. </span> <a
34863509
href="#nth-last-of-type"><code>:nth-last-of-type()</code></a> pseudo-class</h4>
34873510

34883511
<p>The <dfn id=nth-last-of-type
@@ -3512,7 +3535,7 @@ <h4 id=the-nth-last-of-type-pseudo><span class=secno>12.4.2. </span> <a
35123535
<pre>body > h2:not(:first-of-type):not(:last-of-type)</pre>
35133536
</div>
35143537

3515-
<h4 id=the-first-of-type-pseudo><span class=secno>12.4.3. </span> <a
3538+
<h4 id=the-first-of-type-pseudo><span class=secno>12.5.3. </span> <a
35163539
href="#first-of-type-pseudo"><code>:first-of-type</code></a> pseudo-class</h4>
35173540

35183541
<p>Same as <code>:nth-of-type(1)</code>. The <dfn
@@ -3557,7 +3580,7 @@ <h4 id=the-first-of-type-pseudo><span class=secno>12.4.3. </span> <a
35573580
-->&lt;/dl></pre>
35583581
</div>
35593582

3560-
<h4 id=the-last-of-type-pseudo><span class=secno>12.4.4. </span> <a
3583+
<h4 id=the-last-of-type-pseudo><span class=secno>12.5.4. </span> <a
35613584
href="#last-of-type-pseudo"><code>:last-of-type</code></a> pseudo-class</h4>
35623585

35633586
<p>Same as <code>:nth-last-of-type(1)</code>. The <dfn
@@ -3575,7 +3598,7 @@ <h4 id=the-last-of-type-pseudo><span class=secno>12.4.4. </span> <a
35753598
<pre>tr > td:last-of-type</pre>
35763599
</div>
35773600

3578-
<h4 id=the-only-of-type-pseudo><span class=secno>12.4.5. </span> <a
3601+
<h4 id=the-only-of-type-pseudo><span class=secno>12.5.5. </span> <a
35793602
href="#only-of-type-pseudo"><code>:only-of-type</code></a> pseudo-class</h4>
35803603

35813604
<p>The <dfn id=only-of-type-pseudo>:only-of-type</dfn> pseudo-class
@@ -3586,7 +3609,7 @@ <h4 id=the-only-of-type-pseudo><span class=secno>12.4.5. </span> <a
35863609
<code>:nth-of-type(1):nth-last-of-type(1)</code>, but with a lower
35873610
specificity.
35883611

3589-
<h3 id=selected-child-index><span class=secno>12.5. </span> Selected
3612+
<h3 id=selected-child-index><span class=secno>12.6. </span> Selected
35903613
Child-indexed Pseudo-classes</h3>
35913614

35923615
<p> The pseudo-classes in this section are also similar to <a
@@ -3604,7 +3627,7 @@ <h3 id=selected-child-index><span class=secno>12.5. </span> Selected
36043627
class=css>:nth-last-match()</code></a>’ pseudoclasses allow one to build
36053628
a selector for the latter interpretation.
36063629

3607-
<h4 id=the-nth-match-pseudo><span class=secno>12.5.1. </span> <a
3630+
<h4 id=the-nth-match-pseudo><span class=secno>12.6.1. </span> <a
36083631
href="#nth-match-pseudo"><code>:nth-match()</code></a> pseudo-class</h4>
36093632

36103633
<p><dfn id=nth-match-pseudo
@@ -3622,7 +3645,7 @@ <h4 id=the-nth-match-pseudo><span class=secno>12.5.1. </span> <a
36223645
class=css><code>odd</code></code>’ keywords.
36233646
<!-- define <selector>. Split an+b into a similar <notation> -->
36243647

3625-
<h4 id=the-nth-last-match-pseudo><span class=secno>12.5.2. </span> <a
3648+
<h4 id=the-nth-last-match-pseudo><span class=secno>12.6.2. </span> <a
36263649
href="#nth-last-match-pseudo"><code>:nth-last-match()</code></a>
36273650
pseudo-class</h4>
36283651

@@ -4405,6 +4428,16 @@ <h3 id=normative-references><span class=secno>20.1. </span> Normative
44054428
</dd>
44064429
<!---->
44074430

4431+
<dt id=CSS3TEXT>[CSS3TEXT]
4432+
4433+
<dd>Elika J. Etemad; Koji Ishii. <a
4434+
href="http://www.w3.org/TR/2012/WD-css3-text-20121113/"><cite>CSS Text
4435+
Module Level 3.</cite></a> 13 November 2012. W3C Working Draft. (Work in
4436+
progress.) URL: <a
4437+
href="http://www.w3.org/TR/2012/WD-css3-text-20121113/">http://www.w3.org/TR/2012/WD-css3-text-20121113/</a>
4438+
</dd>
4439+
<!---->
4440+
44084441
<dt id=RFC2119>[RFC2119]
44094442

44104443
<dd>S. Bradner. <a href="http://www.ietf.org/rfc/rfc2119.txt"><cite>Key

‎selectors/Overview.src.html‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2227,6 +2227,20 @@ <h3 id="the-empty-pseudo">
22272227
<pre>&lt;foo>this is not &lt;bar>:empty&lt;/bar>&lt;/foo></pre>
22282228
</div>
22292229

2230+
<h3 id='the-blank-pseudo'>
2231+
<code>:blank</code> pseudo-class</h3>
2232+
2233+
<p>The <dfn id='blank-pseudo'>:blank</dfn> pseudo-class is identical to the <code>:empty</code> pseudo-class,
2234+
except that it additionally excludes <a href="http://www.w3.org/TR/css3-text/#white-space-processing">characters subject to whitespace processing</a> [[!CSS3TEXT]] when determining whether an element is empty.
2235+
2236+
<div class='example'>
2237+
<p>For example, the following element matches <code>:blank</code>,
2238+
but not <code>:empty</code>,
2239+
because it contains at least one linebreak, and possibly other whitespace:
2240+
2241+
<pre>&lt;p><br>&lt;/p></pre>
2242+
</div>
2243+
22302244
<h3 id='child-index'>
22312245
Child-indexed Pseudo-classes</h3>
22322246

0 commit comments

Comments
 (0)