Почему браузер отображает новую строку как пробел?

в течение самого долгого времени я хотел понять, почему браузер добавляет пустое пространство между визуализированными элементами HTML, когда между ними есть новая строка, например:

<span>Hello</span><span>World</span>

html выше выведет строку "HelloWorld"без пробел между "Hello" и "World", однако в следующем примере:

<span>Hello</span>
<span>World</span>

html выше выведет строку "Hello World"С пробел между "привет" и "Мир."

теперь у меня нет проблем с принятием того, что это просто так работает период, но то, что меня немного беспокоит, заключается в том, что у меня всегда было впечатление, что пробелы (или новые строки) между элементами html не будут иметь значения в то время, когда браузер отобразил html пользователю.

спасибо.

5 54
html

5 ответов:

браузеры конденсируют несколько пробелов (включая новые строки) в один пробел при рендеринге. Единственное исключение-внутри <pre> элементы или те, которые имеют свойства CSS white-space значение pre или pre-wrap set. (Или в XHTML,.)

51

пробелы между элементами блока игнорируются. Однако пробелы между встроенными элементами преобразуются в одно пространство. Аргументация заключается в том, что встроенные элементы могут быть перемежены с обычным внутренним текстом родительского элемента.

рассмотрим следующий пример:

<p>This is my colored <span class="red_text">Hello</span> <span class="blue_text">World</span> example</p>

в идеальном случае, вы хотите, чтобы пользователь, чтобы увидеть

This is my colored Hello World example

удаление пробелов между двумя пролетами, однако, приведет к:

This is my colored HelloWorld example

но это тот же пример может быть переписан автором (с ОКР о форматировании HTML: -)) как:

<p>
  This is my colored
  <span class="red_text">Hello</span>
  <span class="blue_text">World</span>
  example
</p>

было бы лучше, если бы это было сделано в соответствии с предыдущим примером.

49

HTML указан, чтобы сделать это так:

разрывы строк и пробельные символы

http://www.w3.org/TR/REC-html40/struct/text.html#h-9.1

12

Если бы у вас был символ 'a' между двумя тегами, вы ожидали бы, что он будет отображаться. В этом случае у вас есть символ '\n' между двумя тегами; поведение аналогично и согласовано ('\n' отображается как один пробел).

1

браузеры ошибаются здесь:

http://www.w3.org/TR/html4/appendix/notes.html#h-B.3.1

SGML (см. [ISO8879], раздел 7.6.1) указывает, что разрыв строки сразу после начального тега должен игнорироваться, как и разрыв строки непосредственно перед конечным тегом. Это относится ко всем элементам HTML без исключения.

-1