Продолжаем изучение элементов разметки текста. Элемент P (paragraph) служит для разбиения текста на абзацы. Открывающий тег для этого элемента является обязательным, а закрывающий - необязательным. Элемент этот, естественно, является блочным, но при этом может включать только текст и текстовые элементы. Другие блоки он включать в себя не может. По умолчанию абзацы отделяются от других блоков увеличенным интервалом, в отличие от традиционного набора, где абзацы выделяются красной строкой.

Элемент P имеет атрибут align, отвечающий за выравнивание текста в абзаце. Атрибут является нерекомендованным, правильнее контролировать выравнивание через таблицы стилей. Атрибут align может принимать значения: left (по левому краю), right (по правому краю), centєг(по центру), justify (по правому и левому краям).

Вертикальными чёрточками мы будем обозначать в дальнейшем альтернативные варианты. Значением по умолчанию является left. Т.е. если мы не указываем этот атрибут или браузер не может понять его значение (старые браузеры, например, не понимают равномерное выравнивание justify), то текст выравнивается по левому краю.

Для начала новой строки служит элемент BR (от слова brake, line brake - перевод строки). Не следует путать этот элемент с элементом P. Элемент BR является текстовым элементом. Он не начинает нового абзаца, а просто заставляет браузер перевести строчку до того, как он сделает это сам, дойдя до правого края страницы. Визуально элемент не приводит к увеличению интервала между строками. Состоит только из открывающего тега. Если нужно сделать несколько переводов строк, то нужно вставить соответствующее количество элементов BR. Имеет атрибут clear, который определяет поведение текста, обтекающего изображение. Допустим, текст обтекает некоторое изображение, и мы хотим где-то вставить переводы строк. По умолчанию текст продолжает обтекать картинку.

Но если мы поставим атрибут clear, то текст окажется под картинкой.

Принимает значения: none (когда текст продолжает обтекание). left (когда обтекание прекращается в случае, если картинка выровнена по левому краю, как раз как в нашем случае). Если бы картинка была выровнена по правому краю, то обтекание текста продолжалось бы. Для этого случая атрибут должен иметь значение right. И, наконец, значение all, когда обтекание прекращается в любом случае, вне зависимости от выравнивания картинки.

Бывают случаи, когда нам нужно наоборот, запретить браузеру перевод строки в определенном месте. Браузер осуществляет перевод строк по словам, т.е. нам нужно отметить некоторый пробел как пробел, в котором перенос осуществляться не может. Для этого пробел заменяется на специальную подстановку  , которая расшифровывается как non-breaking space и интерпретируется браузером как неразрывный пробел. Теперь, если перенос и осуществится, то уж никак не в этом месте.

Для обозначения заголовков разделов и подразделов документа предназначены 6 элементов с H1 по H6 (от слова heading - заголовок,

рубрика). Эти элементы соответствуют 6 уровням "важности".разделов. H1 - самый важный, верхнего уровня, H6 - наименее важный. Эти элементы обязаны иметь как открывающий, так и закрывающий теги. Даже если документ не имеет разделов, у него, как правило, есть хотя бы один заголовок - его название. Обычно заголовки отображаются увеличенным кеглем: H1 - самый большой, а дальше идёт постепенное уменьшение.

Элементы заголовков являются блочными, однако, как и абзац, могут содержать только текст и текстовые элементы. Имеют атрибут align, аналогичный такому же атрибуту элемента P. Заодно покажем, как align работает на параграфе. Уже упоминавшийся элемент PRE (от слова preformatted - предварительно отформатированный) заставляет браузер выводить текст точно в том виде, в каком он фигурирует в HTML-коде, со всеми пробелами и переводами сток. Выводится обычно "моноширинным" шрифтом.

PRE является блочным элементом, должен иметь как открывающий, так и закрывающий теги. Может включать текст и текстовые элементы за исключением элементов изображений IMG, встроенных объектов OBJECT, а также элементов, изменяющих размер шрифта: BIG, SMALL и некоторых других.

Для обозначения верхних и нижних индексов служат элементы SUP (superscript) и SUB (subscript). Элементы являются текстовыми, должны содержать как открывающий, так и закрывающий теги. Вот пример нижних и верхних индексов. Элементы могут включать в себя текст или другие текстовые элементы. Для выделения цитат предназначены два элемента: блочный BLOCKQUOTE и текстовый Q. Оба элемента обязаны иметь как открывающий, так и закрывающий теги. BLOCKQUOTE предназначен для больших цитат, которые можно выделить в отдельный блок. Может включать текст, текстовые элементы и другие блочные элементы. Отображается обычно в виде абзаца с увеличенными отступами по бокам.

Текстовый элемент Q предназначен для цитат внутри текста. Согласно спецификации браузеры должны автоматически окружать такие цитаты кавычками. На практике же пока не все браузеры делают это или делают неправильно. Проблема с кавычками заключается в том, что в разных языках правила их использования разнятся. В русском, например, используются "елочки", а в английском - "лапки". Для учета таких вот национальных особенностей в спецификации предусмотрен атрибут lang, который задает язык для подобных элементов. Т. е. теоретически если мы напишем вот так, то должны отобразиться "елочки", а если мы зададим английский язык, то " лапки".

Но пока, если браузеры и ставят кавычки, то ограничиваются примитивным знаком дюйма. Следовательно, пока этот элемент приходится считать малоприменимым и просто ставить кавычки в тексте вручную, с помощью специальных подстановок. BLOCKQUOTE и Q имеют атрибут cite, который должен содержать ссылку на источник цитаты. В браузере, как видите, этот источник нигде не отображается, он нужен только для структурной разметки.

И в заключение несколько слов о переносах. Браузеры пока не умеют автоматически расставлять переносы, как текстовые редакторы или программы верстки, и переносят текст только по словам. Мы можем поставить в нужном месте слова дефис, и тогда браузер сможет сделать в этом месте перенос. Но, поскольку никто не гарантирует идентичного отображения нашей страницы во всех браузерах, может оказаться, что слово помещается в строку, перенос в этом месте не нужен, а посреди слова будет красоваться наш дефис.

Более правильный способ - использовать подстановку ­, которая указывает браузеру место, где можно сделать перенос. Когда он не нужен, слово отобразится слитно, а когда нужен - браузер автоматически должен поставить дефис и перенести оставшуюся часть слова на другую строку. Получается, что, испещрив все слова в нужных местах этими символами, мы получим в документе правильные переносы. Впрочем, на практике, к сожалению (а может, к счастью), мало кто этим занимается.

Итак, мы рассмотрели элементы P (абзац), BR (перевод строки), подстановку   (неразрывный пробел), элементы заголовков, элемент PRE для предварительно отформатированного текста, элементы для верхних и нижних индексов SUP и SUB, элементы для выделения цитат BLOCKQUOTE и Q и подстановку ­ для расстановки переносов.

⇐Разметка текста. phrase elements, font-style-elements | TeachPro WEB-дизайн | Технический уровень - списки⇒