Пробелы в HTML
Всем доброго времени суток. На связи Алексей Гулынин. В прошлой статье мы разобрали что такое "страница 404". В данной статье я бы хотел рассказать, как вставить пробелы в HTML. Уверен, что вы хотя бы раз пробовали написать что-то вроде этого:
<html> <meta charset="utf-8"/> <head><title>Пробелы в HTML</title></head> <body> <p>Начало статьи продолжение следует...</p> </body> </html>
Если вы откроете данную страницу в браузере, то увидите, что никаких пробелов нет. Теги обрезали все пробелы. Так как же вставить пробелы в HTML? Существует несколько вариантов:
1) Использовать тег <pre>…</pre>. Как вы напишите текст в данном теге, так он и будет выведен в браузере, без всякого форматирования и удаления пробелов. Попробуйте набрать пример и проверить:
<html> <meta charset="utf-8"/> <head><title>Пробелы в HTML</title></head> <body> <p><pre>Начало статьи продолжение следует...</pre></p> </body> </html>
Теперь, если вы откроете данную страницу, то увидите, что пробелы появились.
2) Использовать сущность " ". Данная сущность представляет собой одиночный пробел. Редко когда возникает необходимость поставить много пробелов, поэтому рекомендую данный способ вставки пробела в HTML. Можно вставлять несколько подряд. Пример:
<html> <meta charset="utf-8"/> <head><title>Пробелы в HTML</title></head> <body> <p>Начало статьи продолжение следует...</p> </body> </html>
Откройте в браузере и убедитесь, что пробелы появились. Также в данном пункте отмечу, что одиночный пробел можно вставлять ещё вот таким способом " ". Но его я никогда не использовал.
3) Использовать CSS. Более подробно с CSS вы можете познакомиться здесь. Делается это для данного примера так:
<html>
<meta charset="utf-8"/>
<head><title>Пробелы в HTML</title>
<style>
p {
white-space: pre;
}
</style>
</head>
<body>
<p>Начало статьи продолжение следует...</p>
</body>
</html>
Кратко разберу, что здесь написано. В заголовке документа, между тегами <head>…</head> мы определяем стили с помощью тега <style>. В данном случае свойство white-space определяет, как отображать пробелы между словами. Значение pre данного свойства как раз то, что нам нужно. Мы данное свойство используем для всех тегов <p>.
В данной статье вы узнали, как вставить пробелы в HTML.
В качестве домашнего задания наберите все эти примеры и убедитесь, что всё работает.
На связи был Алексей Гулынин, оставляйте свои комментарии, увидимся в следующих статьях.
