2015-09-10 9 views
15

Ich versuche, das HTML-Whitespace-Verarbeitungsmodell besser zu verstehen. Im Moment bin ich den Vergleich von zwei HTML-Schnipsel:HTML-Leerzeichen: Leerzeichen vor und nach <br>

<div>a <br>z</div> 

und

<div>a<br> z</div> 

Der erste Schnipsel, wenn renered, ergibt zwei Linien: "a " und "z" (also die erste Zeile hat ein Leerzeichen.) Das zweite Snippet liefert zwei Zeilen: "a" und "z". In der zweiten Zeile befindet sich kein führender Platz.

Meine Frage ist: warum? Ich verwende diese http://www.w3.org/TR/CSS2/text.html#white-space-model derzeit als Referenz. Darin heißt es

  1. Wenn ein Raum (U + 0020) am Anfang einer Zeile 'weiß-Raum' auf 'normal' ist, 'nowrap' oder 'pre-line', es wird entfernt .
  2. Alle Registerkarten (U + 0009) werden als horizontale Verschiebung gerendert, die die Startkante des nächsten Symbols mit dem nächsten Tabstopp anzeigt. Tabstopps treten an Punkten auf, die ein Vielfaches der 8-fachen Breite eines Leerraums (U + 0020) sind, die in der Blockschrift von der Anfangskantenkante des Blocks wiedergegeben werden.
  3. Wenn ein Leerzeichen (U + 0020) am Ende einer Zeile den Wert 'white-space' auf 'normal', 'nowrap' oder 'pre-line' gesetzt hat, wird es ebenfalls entfernt.
  4. Wenn Leerzeichen (U + 0020) oder Tabulatoren (U + 0009) am Ende einer Zeile 'white-space' auf 'pre-wrap' eingestellt haben, können UAs diese visuell ausblenden.

A naive Lesen dieses würde bedeuten, dass, da ein Raum, der der Anfang oder Ende einer Zeile zu entfernen ist, (wenn ‚Weißraum‘ ‚normal‘ ist), wobei die erste Meine Snippets sollten kein Leerzeichen ergeben. Aber das ist nicht der Fall.

Also, was ist los?

Meine aktuelle Theorie ist, dass die <br> insgeheim als ein "Zeichen" gezählt wird, das im ersten Ausschnitt verhindert, dass der nachstehende Raum am "Ende" seiner Zeile ist. Aber ich habe wirklich keine Ahnung.

EDIT: Um klar zu sein, kann ich &nbsp; verwenden, um Räume nach Belieben zu erstellen. Meine Frage ist, welche Regel (in Bezug auf einige Spezifikationen) das obige Verhalten hervorruft.

+0

https://drafts.csswg.org/css-text/#white-space-phase-1, die aktuelle Spezifikation, könnte einige Einblicke geben – sideshowbarker

+0

@Vucko: So erscheint es im DOM-Inspektor, nicht wie es ist gerendert – BoltClock

+0

@sideshowbarker: Gute Trauer. Die Menge an Jargon in CSS-Text lässt den CSS2.1-Text wie ein Kinderbuch lesen. – BoltClock

Antwort

2

Gute Frage! Ich habe das Verhalten sowohl in Chrome und Firefox, bestätigt und bestätigt, dass es nichts mit <br> zu tun hat, wie sie auch von einem gewöhnlichen Zeilenumbruch in white-space: pre-line Bedingungen ausgelöst wird:

<div style="white-space:pre-line">a 
z</div> 

Ich habe sent an email to the list bitten um Klarstellung Dieses Problem, und erkundigen, ob wir die Spezifikation ändern sollten, um Implementierungen zu entsprechen, oder Fehler in Browsern, um die Spezifikation zu erfüllen.

Verwandte Themen