Внимание! Большая ширина страницы - не ошибка автора, а следствие приведенного примера.
ТЕГИ ФОРМАТИРОВАНИЯ ТЕКСТА
На большинстве сайтов информация представлена в форме текста. Даже на сайтах, посвященных музыке, фото или живописи, текст присутствует в виде всякого рода пояснений. А текст мы привыкли видеть оформленным так, чтобы его было удобно читать: с полями, абзацами, заголовками и пр., т.е. отформатированным. Но, дело в том, что если мы поместим в тело HTML-документа прекрасно оформленный текст (например, скопируем готовый документ из Word-a), и посмотрим это творение в окне браузера, то увидим просто набор предложений, довольно неудобных для чтения. Объяснить браузеру, как он должен показывать людям наш текст, нужно при помощи тегов.
Начнем с того, о чем я уже упоминал. Предположим, что у нас есть прекрасно оформленный в каком-либо текстовом редакторе документ, и мы хотим в таком виде его показать. Для этого существует тег-контейнер <PRE>...</PRE>. Весь текст, помещенный в этот тег, выводится браузером "как есть", со всеми элементами форматирования. Казалось бы, что еще нужно? Но не все так просто. Во-первых, сохраняются только признаки форматирования: пробелы, перенос строки, табуляция и т.д. А если у нас в документе красивые заголовки, выделенные особо значимые куски текста и пр.? И, во-вторых, браузер не сможет оптимизировать преформатированный текст под разрешение экрана нашего читателя, т.к. будет поставлен в жесткие условия тега <PRE>...</PRE>, а это доставит неудобства этому самому читателю. А мы этого не хотим, потому что и писали то все это именно для этого конкретного человека. Так, что одним тегом не обойтись, нужно идти дальше.
Из всех элементов, применяемых для форматирования текста, браузеры безо всяких подсказок понимают только один: пробел. Причем, только один пробел. Поэтому, если Вы хотите написать что-то с красной строки, Вам придется употребить специальный, так называемый, символьный объект или, по другому, эскейп-последовательность: знак неразрывного пробела &nbsp;. Сколько таких последовательностей поставите, столько пробелов сделает браузер. Еще этот знак удобно употреблять в случаях, когда нужно обозначить, что в этом месте рвать строку нежелательно. Браузер ведь сам определяет, в зависимости от разрешения экрана и шрифтов, применяемых хозяином, где заканчивается одна строка и начинается другая. И если, например, фраза "Мой вес 73 кг" будет выглядеть таким образом: "Мой вес 73
кг" - это будет как-то не очень... Поэтому в окне редактора ее стоит написать так "Мой вес 73&nbsp;кг". Эскейп-последовытельности существуют для всех символов из второй половины ASCII-таблицы, и при желании Вы их найдете в спецификации HTML-4, которую я Вам советовал скачать. Но все нам употреблять не придется, а вот некоторые, например, заменяющие угловые скобки < и > (&lt; и &gt; ), иногда приходится.
Тег-контейнер <P>...</P> - тег параграфа. Закрывающий элемент не обязателен, но если он отсутствует, браузер не оставляет после абзаца пустую строку. Браузеры выделяют текст, помещенный в этот тег, пустыми строчками. Имеет один параметр:
На большинстве сайтов информация представлена в форме текста. Даже на сайтах, посвященных музыке, фото или живописи, текст присутствует в виде всякого рода пояснений. А текст мы привыкли видеть оформленным так, чтобы его было удобно читать: с полями, абзацами, заголовками и пр., т.е. отформатированным. Но, дело в том, что если мы поместим в тело HTML-документа прекрасно оформленный текст (например, скопируем готовый документ из Word-a), и посмотрим это творение в окне браузера, то увидим просто набор предложений, довольно неудобных для чтения. Объяснить браузеру, как он должен показывать людям наш текст, нужно при помощи тегов.
Начнем с того, о чем я уже упоминал. Предположим, что у нас есть прекрасно оформленный в каком-либо текстовом редакторе документ, и мы хотим в таком виде его показать. Для этого существует тег-контейнер <PRE>...</PRE>. Весь текст, помещенный в этот тег, выводится браузером "как есть", со всеми элементами форматирования. Казалось бы, что еще нужно? Но не все так просто. Во-первых, сохраняются только признаки форматирования: пробелы, перенос строки, табуляция и т.д. А если у нас в документе красивые заголовки, выделенные особо значимые куски текста и пр.? И, во-вторых, браузер не сможет оптимизировать преформатированный текст под разрешение экрана нашего читателя, т.к. будет поставлен в жесткие условия тега <PRE>...</PRE>, а это доставит неудобства этому самому читателю. А мы этого не хотим, потому что и писали то все это именно для этого конкретного человека. Так, что одним тегом не обойтись, нужно идти дальше.
Из всех элементов, применяемых для форматирования текста, браузеры безо всяких подсказок понимают только один: пробел. Причем, только один пробел. Поэтому, если Вы хотите написать что-то с красной строки, Вам придется употребить специальный, так называемый, символьный объект или, по другому, эскейп-последовательность: знак неразрывного пробела &nbsp;. Сколько таких последовательностей поставите, столько пробелов сделает браузер. Еще этот знак удобно употреблять в случаях, когда нужно обозначить, что в этом месте рвать строку нежелательно. Браузер ведь сам определяет, в зависимости от разрешения экрана и шрифтов, применяемых хозяином, где заканчивается одна строка и начинается другая. И если, например, фраза "Мой вес 73 кг" будет выглядеть таким образом: "Мой вес 73
кг" - это будет как-то не очень... Поэтому в окне редактора ее стоит написать так "Мой вес 73&nbsp;кг". Эскейп-последовытельности существуют для всех символов из второй половины ASCII-таблицы, и при желании Вы их найдете в спецификации HTML-4, которую я Вам советовал скачать. Но все нам употреблять не придется, а вот некоторые, например, заменяющие угловые скобки < и > (&lt; и &gt; ), иногда приходится.
Тег-контейнер <P>...</P> - тег параграфа. Закрывающий элемент не обязателен, но если он отсутствует, браузер не оставляет после абзаца пустую строку. Браузеры выделяют текст, помещенный в этот тег, пустыми строчками. Имеет один параметр:
ALIGN= , который может принимать значения:
LEFT - выравнивание по левому краю,
CENTER - выравнивание по центру,
RIGHT - выравнивание по правому краю и
JUSTIFY - выравнивание по ширине
LEFT - выравнивание по левому краю,
CENTER - выравнивание по центру,
RIGHT - выравнивание по правому краю и
JUSTIFY - выравнивание по ширине
По умолчанию принимается выравнивание по левому краю. Пример использования этого тега - следующий абзац. Он написан внутри тега <P>...</P>:
Тег принудительного перевода строки <BR>. Говорит браузеру, в каком месте необходимо прервать строку и начать новую. Закрывающей части не имеет. Используется, как и тег <P>...</P>, для разделения абзацев, но в отличие от него не оставляет пустой строки. Использование этого тега в HTML аналогично использованию клавиши ENTER в Word-e. Имеет один параметр CLEAR, прекращающий обтекание рисунка. О его использовании - в статье о применении графики.
Тег, запрещающий перевод строки - <NOBR>...</NOBR>. Весь текст, помещенный внутри этого тега, будет выведен браузером в одну строчку. Что Вы и наблюдаете на примере этой строки. Можно все же разрешить браузеру перевести строку в определенном месте текста внутри этого тега, если поставить в соответствующем месте тег <WBR>. После этого тега, как видите, браузер начал новую строчку.
Теги заголовков <H1> - <H6>. Теги контейнеры. Текст, помещенный в них, выводится как заголовок. Имеет параметр выравнивания по горизонтали, аналогичный с тегом <P>. Закрывающая часть обязательна.
