Читать «HTML 5, CSS 3 и Web 2.0. Разработка современных Web-сайтов» онлайн - страница 22

Владимир Дронов

Текст фиксированного формата

Аппетит приходит во время еды. Мы еще не успели доделать свою первую Web- страницу, а уже хотим сделать еще одну. Давайте же ее сделаем. Дадим аппетиту разгуляться!

Новая Web-страница (листинг 2.10) будет посвящена тегу <TITLE>.

Листинг 2.10

<!DOCTYPE html>

<HTML>

<HEAD>

<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=utf-8">

<TITLE>Тег TITLE</TITLE>

</HEAD>

<BODY>

<H1>Тег TITLE</H1>

<P>Тег TITLE служит для указания названия Web-страницы. Он ставится в ее секции заголовка.</P>

<H6>Пример:</H6>

<P>!HEAD! !TITLE!Я — заголовок Web-страницы!/TITLE!

!HEAD!</P>

</BODY>

</HTML>

Здесь мы поместили краткое описание тега <TITLE> и код примера, имеющий такой вид:

!HEAD!

!TITLE!Я — заголовок Web-страницы!/TITLE!

!/HEAD!

Вместо символов < и >, которые, как мы помним из главы 1, недопустимы в обычном тексте, мы поставили восклицательные знаки. В главе 3 мы узнаем, как все- таки вставить в текст недопустимые символы, и заменим их.

Сохраним  набранный  код  в  файле с именем t_title.htm и откроем его в Web-обозревателе. И что мы там увидим?

Рис. 2.1. Web-страница t_title.htm в Web-обозревателе. Обратим внимание на код примера

Как видно на рис. 2.1, Web-обозреватель вывел код примера в одну строку и без всяких отступов. Но ведь мы разбили его на три строки и создали отступы с по- мощью пробелов, чтобы HTML-код лучше читался и сразу была видна вложенность тегов! Что случилось?

Вспомним два правила, которыми руководствуется Web-обозреватель при выводе текста блочного элемента и которые были перечислены в разделе, посвященном абзацам. Эти правила гласят, что два или более следующих друг за другом пробела или переноса строки преобразуются в один пробел и перенос строки считается за пробел. Так Web-обозреватель и поступил: преобразовал переносы строки в пробелы, а последовательные пробелы — в один пробел. И вывел код примера в виде обычного абзаца, который у него поместился в одну строку.

Web-обозреватель все сделал правильно! Просто мы не указали ему, как следует выводить данный текст.

Специально для случаев, когда текст должен быть выведен именно так, как набран, с сохранением всех пробелов и переносов строк, язык HTML предусматривает парный тег <PRE>. Выводимый текст помещают внутри этого тега (листинг 2.11).

Листинг 2.11

<PRE>Я — текст, который будет выведен на Web-страницу

со всеми

отступами и

переносами строк.</PRE>

Такой текст называется текстом фиксированного формата.

Правила отображения текста фиксированного формата:

-  для вывода используется моноширинный шрифт (у моноширинного шрифта все символы имеют одинаковую ширину, в отличие от пропорциональных, у которых ширина символов различна);