В чем разница между "" и ""? - PullRequest
Новая
       7

В чем разница между "" и ""?

119 голосов
/ 31 августа 2009

Они оба означают пространство, но есть ли разница?

Ответы [ 13 ]

163 голосов
/ 31 августа 2009

Один - это неразрывный пробел , а другой - обычный пробел. Неразрывный пробел означает, что строка не должна быть заключена в эту точку, как если бы она не была заключена в середину слова.

Кроме того, как указывает Свенд в своем комментарии, неразрывные пробелы не разрушаются.

61 голосов
/ 31 августа 2009

Сущность   создает неразрывный пробел, который используется, когда вам не нужен автоматический разрыв строки в этой позиции. Обычный пробел имеет код символа 32, а неразрывный пробел - код символа 160.

Например, когда вы отображаете числа с пробелом в качестве разделителя тысяч: 1 234 567, вы используете неразрывные пробелы, чтобы число нельзя было разделить на отдельные строки. Если вы отображаете валюту и между суммой и валютой есть пробел: 42 шведских крон, то вы используете неразрывный пробел, чтобы вы не получили сумму в одной строке и валюту в следующей.

42 голосов
/ 31 августа 2009

В дополнение к другим ответам здесь, неразрывные пробелы не будут «свернуты», как обычные пробелы. Например, оба 

<p>Word1          Word2</p>

и 

<p>Word1 Word2</p>

будет отображать то же самое в любом браузере, а 

<p>Word1&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Word2</p>

сохранит пробелы при визуализации.

26 голосов
/ 31 августа 2009

Не столько ответ, сколько примеры ...

Пример № 1: 

<div style="width:45px; height:45px; border: solid thin red; overflow: visible">
    Hello&nbsp;There
</div>

Пример № 2: 

<div style="width:45px; height:45px; border: solid thin red; overflow: visible">
    Hello There
</div>

И ссылка на скрипку .

8 голосов
/ 06 августа 2015

Рабочий пример можно посмотреть здесь:

http://codepen.io/anon/pen/GJzBxo

и

http://codepen.io/anon/pen/LVqBQo

Тот же div, тот же текст, разные "пробелы" 

<div style="width: 500px; background: red"> [loooong text with spaces]</div>

против 

<div style="width: 500px; background: red"> [loooong text with &nbsp;]</div>
5 голосов
/ 31 августа 2009

Как уже упоминалось, вы не получите разрыв строки, где есть "пробел без перерывов".

Также следует помнить, что элементы, содержащие только "", могут отображаться некорректно, где & nbsp; буду работать. То есть, по крайней мере, в 6 (насколько я помню, IE7 имеет ту же проблему), если у вас есть пустой элемент таблицы, он не будет применять стили, например границы, к элементу, если нет содержимого, или только белый пространство. Таким образом, следующее не будет отображаться с границами: 

<td></td>
<td> <td>

Принимая во внимание, что границы будут отображаться в этом примере: 

<td>& nbsp;</td>

Хммм - пришлось вставить пустышку, чтобы он правильно отображался здесь

5 голосов
/ 31 августа 2009

Несколько обычных символов пробела (пробел, табулятор и разрыв строки) обрабатываются как один символ пробела :

Для всех элементов HTML, кроме PRE, последовательности пробелов разделяют «слова» (здесь мы используем термин «слово» для обозначения «последовательностей непробельных символов»). При форматировании текста пользовательские агенты должны идентифицировать эти слова и размещать их в соответствии с соглашениями конкретного письменного языка (сценария) и целевого носителя.

So 

foo    bar

отображается как 

foo bar

Но всегда отображается пробел без перерыва. Так 

foo&‍nbsp;&‍nbsp;&‍nbsp;bar

отображается как 

foo   bar
2 голосов
/ 31 августа 2009

Первое не обрабатывается HTML-парсером как пробел, второе -. В результате "" не гарантированно будет отображаться в определенной разметке HTML, в то время как неразрывное пространство всегда будет отображаться.

0 голосов
/ 21 мая 2019

TLDR; В дополнение к принятому ответу; Один неявный, а другой явный.

Когда HTML, который вы написали или сгенерировали приложением / библиотекой / фреймворком, читается вашим браузером, лучше всего понять, что имел в виду ваш HTML (который может варьироваться в зависимости от браузера) Когда вы используете коды сущностей HTML, вы более специфичны для браузера. Вы явно говорите, что хотите отобразить символ для пользователя (а не то, что вы просто добавляете интервалы в HTML для более удобного чтения, например, для разработчика).

Чтобы быть более конкретным, если бы выходной HTML был: 

<html>
   <title>hello</title>
   <body>
       <p>
           Tell me and I will forget. Teach me and I
           may remember.  Involve me and I will learn.
       </p>
   </body>
</html>

Браузер будет отображать только один пробел между всеми этими словами (даже те, которые были с отступом для лучшей читабельности для разработчика.

Если, однако, вы поставили то же самое и изменили только тег <p> на: 

<p>Hello&nbsp;&nbsp;&nbsp;There</p>

Тогда он будет отображать пробелы, как вы указали это более явно. Существует некоторая история использования этих пространств для стилизации. Это использование было несколько уменьшено, поскольку CSS повзрослел. Тем не менее, все еще существуют допустимые применения для многих сущностей символов HTML: избегание неожиданного / непреднамеренного толкования (например, если вы хотите отобразить код). У w3 есть отличная страница для отображения других кодов символов .

0 голосов
/ 01 сентября 2009

&nbsp; является наращиваемым, что означает, что вы можете создать несколько пробелов все вместе.

HTML будет анализировать только один пробел '', а остальные отбрасывает ...

Если вы хотите пять пробелов, вы должны поставить 5 x &nbsp;

Страница:
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...