Unterschied zwischen leeren und leeren Pseudo-Klassen

Question

Was ist der Unterschied zwischen: leer und: leer (CSS-Selektoren Level 4 Entwurf)? Anders als die Tatsache, dass leer nur in Firefox ab sofort funktioniert.

div div{ 
 
    
 
    width:100px; 
 
    height:100px; 
 
    display:inline-block; 
 
    margin:5px; 
 
    } 
 
div.emptyCell:empty{ 
 
    
 
    background:#009688; 
 
    
 
    } 
 
div.blankCell:blank{ 
 
    
 
    background:#3F51B5; 
 
    
 
    }

<div><div class="emptyCell"><!-- nothing but a comment--></div> 
 
<div class="emptyCell"></div> 
 
<div class="emptyCell"><!-- nothing but a comment--></div> 
 
<div class="emptyCell"></div> 
 
    </div> 
 
<div> 
 
<div class="blankCell"></div> 
 
<div class="blankCell"><!-- nothing but a comment--></div> 
 
<div class="blankCell"></div> 
 
<div class="blankCell"><!-- nothing but a comment--></div> 
 
    </div>

Answer 1

Die: blank pseudo-Klasse basiert auf der: empty pseudo-Klasse. Wie : leer,: leer wählt Elemente, die überhaupt nichts enthalten, oder enthalten nur einen HTML-Kommentar. Aber,: blank wird auch Elemente auswählen, die Leerzeichen enthalten, die: leer wird nicht.

css-tricks :blank

Auch From the W3c Working Draft on selectors level 4:

Die: blank pseudo-Klasse ist identisch mit der: empty pseudo-Klasse, außer dass es schließt zusätzlich characters affected by whitespace processing [CSS3TEXT], wenn bestimmt wird, ob Ein Element ist leer.

Beispiel:

Zum Beispiel kann das folgende Element entspricht: blank, aber nicht: leer, weil sie mindestens einen Zeilenumbruch enthält, und möglicherweise auch andere Leerzeichen:

<p> 
</p> 

Answer 2

werden alle angegebenen Elemente übereinstimmen, da ein Elementknoten, der nur Kommentarknoten enthält, im Wesentlichen sa ist mich als Elementknoten ohne Kinder, soweit es CSS betrifft. Aus diesem Grund sehen Sie keinen Unterschied zwischen den Spielen.

Der Unterschied ist, dass :blank mit Elementen übereinstimmt, die nur aus Leerzeichen bestehen, die ansonsten nicht als :empty gelten. Dies liegt daran, dass Leerraumknoten wirklich nur Textknoten sind, die nur Leerzeichen enthalten, und ein Element mit einem untergeordneten Textknoten kein leeres Element ist.

Wichtig jedoch zu beachten ist, dass die CSSWG :empty Wechsel erwägen, so dass sie Elemente übereinstimmt, die auch nur Leerzeichen enthalten, wodurch die Notwendigkeit für eine separate und verwechslungs namens vermieden, :blank Pseudoklasse. Dies wurde behoben just a few weeks ago. Daher kann :blank wie in der aktuellen WD vorhanden ist oder möglicherweise nicht weiterhin in der nächsten WD, die sie irgendwann bald veröffentlichen wollen sehen, wie die WD zuletzt aktualisiert wurde vor mehr als zwei Jahren.

Wenn das geschieht, ist die Antwort auf diese Frage wird sein:

:blank war ein origineller Vorschlag zu Selektoren Ebene 4 für die Elemente passend, die entweder keinen Inhalt haben oder nur Leerzeichen enthalten. Es wurde seitdem entfernt und seine Funktionalität in Ebene 4 subsumiert, was die Notwendigkeit einer separaten und verwirrend benannten Pseudo-Klasse überflüssig macht.