По умолчанию, любое количество пробелов идущее в html-коде подряд, на web-странице отображается как один. Что можно сделать, если необходимо выводить несколько подряд идущих пробелов?
Как вариант можно использовать тег <PRE> определяющий блок предварительного форматирования текста. Такой текст обычно отображается моноширинным шрифтом и со всеми пробелами между словами. Например, следующий html-код:
<PRE> перед строкой два пробела
между словами три пробела</PRE>
Будет интерпретирован браузером следующим образом:
перед строкой два пробела между словами три пробела
Чтобы избавиться от отображения текста моноширинным шрифтом, можно воспользоваться CSS-правилом white-space: pre. Например:
<div style="white-space: pre">текст с пробелами
без моноширинного шрифта</div>
Результатом интерпретации браузером приведённого html-кода станет следующее:
текст с пробелами
без моноширинного шрифта
Здесь, следует отметить тот факт, что в обоих вариантах слишком длинная строка не будет переноситься, если достигнет конца какой либо области. Эту проблему может решить использование CSS-правило: white-space: pre-wrap — однако, что касается браузера Internet Explorer, то в старых его версиях, указанные CSS-правила могут не сработать.
Наиболее же оптимальным вариантом здесь может быть использование escape нотации символа пробел, который в других контекстах обычно называется «непрерывным пробелом» (англ. no break space), представляющий собой комбинацию: . Например, html-код:
перед строкой два пробела<br />
между словами пять пробелов
Будет интерпретирован браузером следующим образом:
перед строкой два пробела
между словами пять пробелов
Обратите внимание, что «непрерывные пробелы» интерпретируются браузером, как и слова, между которыми можно поставить обычные пробелы. В тоже время, слова разделенные только «непрерывными пробелами», достигнув конца какой либо области, как и в случае с тегом <PRE>, переноситься не будут. Например:
слово1 слово2
Это удобно если необходимо соблюсти правила смыслового переноса слов.