Урок 2.
Оформление текста
Как известно, основное наполнение Web-страниц — это все-таки текст. За редким исключением специальных сайтов-галерей. Поэтому неудивительно, что в HTML введено столько различных средств управления .отображения текста.
На самом деле, для того, чтобы в окне просмотра браузера отобразить текстовую строку, Никаких тегов применять не требуется: Достаточно просто написать сам текст. Но когда нужно уже разбит его хотя бы на абзацы, вот туг надо пользоваться тегами. Дело в том, что в различных компьютерных системах используются различные символы для разбивки текста на абзацы, a HTML-документы всегда должны отображаться по возможности одинаково на самых различных компьютерных платформах. Поэтому и пришлось ввести теги, обозначающие абзацы.
В начале каждого абзаца ставится тег < р>, а в конце -, закрывающий тег < /Р>. При этом, тег, естественно, обладает некоторыми параметрами. В их число входят уже известные нам общие параметры идентификации class и id, параметр стилевого оформления style, который нам предстоит рассмотреть во второй главе, и параметр-выравнивания align. Вот о последнем параметре нам следует поговорить несколько поподробнее.
В HTML термин "выравнивание" относят как к горизонтальному, так и к вертикальному позиционированию элемента. Но в случае с абзацами текста имеет смысл говорить только о горизонтальном выравнивании или, как его еще называют, "выключке".
Выключка позволяет прижимать абзац к левому или правому краю окна просмотра браузера, центрировать его или растягивать слова таким образом, чтобы текст равномерно занимал всю ширину отведенного ему места. Для этих целей используются значения left, right, center и justify, соответственно.
Пример:
< html>
< head>
< title> Горизонтальное выравнивание a63aцeв< /title>
< /head>
< body>
< p align="left">Aбзац, прижатый к левому краю< /р>
< р align="right">Aбзац, прижатый к лравому краю< /р>
< р align="center">Центрированный абзац< /р>
< p align="justify">Aбзац, растянутый по ширине
< /body>
< /html>
Результат:
Иногда для того, чтобы сильнее отделить один абзац от другого, создатели Web-страниц пытаются использовать пустые абзацы, т. е. между стартовым и конечным тегом абзаца ничего нет. Согласно спецификациям, браузеры должны просто игнорировать подобные конструкции. Поэтому для разделения абзацев или принудительного обрыва строки внутри одного абзаца следует использовать тег . Это директивный тег. Он просто обозначает то место, где надо перенести отображение на другую строку.
Пример:
< html>
< head>
< title> Принудительные разрывы cтрок< /title>
< /head>
< body>
< р>Aбзац, который мы Принудительно разорвали< /р>
< р>Следующий абзац< /р>
< br>
< р>Абзац после принудительного разрыва< /р>
< /body>
< /html>
Результат:
Тег < font> обладает следующими, присущими именно ему параметрами: size, использующийся для указания размера применяемого шрифта, color - для установки цвета символов шрифта, и face, указывающий, какой именно шрифт будет применяться для отображения текста. Разберем эти параметры.
Как мы только что говорили, параметр size применяется для указания размера символов используемого шрифта. В качестве значений этого параметра используются цифры от единицы до семи. Они обозначают некий относительный размер символов. Дело в том, что в HTML нельзя установить абсолютный размер символов в пунктах, как мы это привыкли делать в обычных офисных приложениях. Пользователь будет просматривать Web-страницу на своем компьютере, и нам заранее неизвестно, какие шрифты могут быть у него установлены, и какие их размеры доступны. Поэтому мы можем лишь указать относительный размер шрифта, а браузер пользователя сам подберет максимально подходящий размер.
Также в качестве значения параметра size мы можем указывать и изменение размера шрифта.
Пример:
< html>
< head>
< title> Размер сиволов< /tit1е>
< /head>
< body>
< p>< font sizе=*7">Седьмой paзмep< /font>< /p>
< p>< font sizе="6">Шестой paзмepp< /font>< /p>
< p>< font sizе="5">Пятый paзмep< /font>< /p>
< p>< font sizе="4">Четвертый paзмep< /font>< /p>
< p>< font sizе="3">Третий paзмep< /font>< /p>
< p>< font sizе="2">Второй paзмep< /font>< /p>
< p>< font size="l"^Первый paзмep< /font>< /p>
< p>< basefont size=2xfont з12е="+2">Смещение paзмepa< /font>< /p>
< /body>
< /html>
Результат:
Но мы рассмотрели применение только одного атрибута тега < font >. На очереди — процедура установки цвета символов применяемого шрифта. Мы уже знаем, что для этого применяется параметр color. О том, как именно записывать обозначение того или иного цвета м:ы говорили в предыдущем разделе, т. е. нам осталось всего лишь привести пример.
Пример:
< html>
< head>
< title> Начертания cимволов< /title>
< /head>
< body>
< p> < font face-="Times New Roman"> Текст бывает < b> полужирным < /b> или < i> курсивным < /i> < br>А может быть одновременно и < b>< i>полужирным и курсивным< /i>< /b>< /р>
< р>Бывает < u>подчеркнутым< /u> и < strike>nepeчepкнутым< /strike>.
< Р>или < tt>моноширинным< /tt> .
< р>Мы можем < big>увеличивать< /big> и < small>уменьшать< /small> размер символов.< /р>
< /body>
< /html>
Результат:
Как именно отображает индексы браузер?
Пример:
< html>
< head>
< title>Bepxние и нижние индексы< /title>
< body>
< р>Вода это H< sub>2< /sub>0< /p>
< р>Соотношение массы и энергии — Е = mc< sup>2< /supx>< /p>
< /body>
< /html>
Результат:
