Книга: HTML, XHTML и CSS на 100%

2.3. Создание обрывов строк

2.3. Создание обрывов строк

С оформлением абзаца все понятно. Что же делать, если возникает необходимость оборвать строку, не закрывая абзац, например в том же эпиграфе для записи стихов?

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

Для переноса текста на новую строку служит элемент BR, он не требует закрывающего тега, однако рекомендуется записывать его открывающий тег как <BR />, чтобы все программы отображали его корректно.

В листинге 2.3 представлен пример кода для принудительного переноса строки.

Листинг 2.3. Обрыв строки

<html>

<head>

<title>Обрыв строки</title>

</head>

<body>

Наша Таня громко плачет,<br />

Уронила в речку мячик.<br />

</body>

</html>

На рис. 2.3 представлен результат обработки браузером кода из листинга 2.3.


Рис. 2.3. Обрыв строки

Из рис. 2.3 видно, что при использовании элемента BR пустая строка после переноса не добавляется.

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

Для этого применяют атрибут clear элемента BR. Атрибут может принимать следующие значения:

• all – запрещает обтекание элемента с двух сторон;

• left – запрещает обтекание с левой стороны плавающего объекта, расположенного после элемента BR;

• right – запрещает обтекание с правой стороны плавающего объекта, расположенного после элемента BR;

• none – отменяет свойство.

Если обтекание запрещено, то текст, следующий за элементом BR, будет отображаться на строке после плавающего объекта.

Кроме обязательного переноса строки, иногда нужно использовать обратное действие, то есть гарантировать, что текст не будет перенесен на новую строку ни в коем случае. Для создания таких неразрывных строк предназначен элемент NOBR, который требует наличия закрывающего тега. Текст, расположенный внутри элемента, будет размещаться в одной строке. При необходимости браузер создаст горизонтальную полосу прокрутки.

Иногда строка может оказаться очень длинной и неудобной для чтения, поэтому внутри элемента NOBR можно использовать элемент WBR, который указывает место для возможного переноса строки.

В листинге 2.4 представлен пример использования элементов NOBR и WBR.

Листинг 2.4. Запрет переноса строки

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />

<title>Обрыв строки</title>

</head>

<body>

<nobr>Это очень важная строка, ее ни в коем случае нельзя переносить на другую строку, однако в этом месте <wbr>возможно сделать перенос.</nobr>

</body>

</html>

На рис. 2.4 показано отображение в браузере кода из листинга 2.4.


Рис. 2.4. Запрет переносов

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

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

Оглавление книги


Генерация: 1.459. Запросов К БД/Cache: 3 / 0
поделиться
Вверх Вниз