Главная » Статьи » Уроки html

Урок 4. HTML-теги для форматирования текста
Здесь мы рассмотрим не самые популярные html-теги текста, но знать их все-таки желательно.

Тег abbr

Теги <abbr></abbr> указывают на то, что текст является аббревиатурой. По умолчанию текст подчеркивается пунктиром, а при наведении на него курсора мыши появляется всплывающая подсказка с расшифровкой аббревиатуры. Это достигается добавлением в тег параметра title, в качестве значения которого и выступает расшифровка.

Пример:
&lt;html&gt; &lt;head&gt; &lt;title&gt;Заголовок документа&lt;/title&gt; &lt;/head&gt; &lt;body&gt; &lt;abbr title="HyperText Markup Language"&gt; HTML &lt;/abbr&gt; &lt;/body&gt; &lt;/html&gt;




Один недостаток - этот тег не поддерживается браузером Internet Explorer ниже 8 версии.

Тег acronym

Теги <acronym></acronym> ведут себя аналогично тегам <abbr></abbr> , но поддерживаются всеми браузерами. Кстати, акронимы - это устоявшиеся слова, состоящие из аббревиатур (США, СПИД).

Пример кода:
&lt;html&gt; &lt;head&gt; &lt;title&gt;Заголовок документа&lt;/title&gt; &lt;/head&gt; &lt;body&gt; &lt;acronym title="Союз Советских Социалистических Республик"&gt; СССР &lt;/acronym&gt; &lt;/body&gt; &lt;/html&gt;


Тег address

Теги <address></address> применяются для указания адреса. Отображается курсивом с новой строки.

Пример кода:
&lt;html&gt; &lt;head&gt; &lt;title&gt;Заголовок документа&lt;/title&gt; &lt;/head&gt; &lt;body&gt; Пишите по адресу: &lt;address&gt; Ленинский пр., д.2 &lt;/address&gt; &lt;/body&gt; &lt;/html&gt;


Тег code

Теги <code></code> используются при необходимости вывести на экран фрагмент программного кода. Браузеры обычно отображают его как моноширинный текст уменьшенного размера.

Пример кода:
&lt;html&gt; &lt;head&gt; &lt;title&gt;Заголовок документа&lt;/title&gt; &lt;/head&gt; &lt;body&gt; Код программы: &lt;code&gt; function addColumn(){ } &lt;/code&gt; &lt;/body&gt; &lt;/html&gt;
Теги del, strike, s

Теги <del></del> делают текст перечеркнутым. Аналогично ведут себя теги <strike></strike> и теги <s></s> , но они не рекомендуются к использованию спецификацией HTML 4.0.

Пример кода:
&lt;html&gt; &lt;head&gt; &lt;title&gt;Заголовок документа&lt;/title&gt; &lt;/head&gt; &lt;body&gt; &lt;del&gt; Этот текст в тегах del &lt;/del&gt;&lt;br&gt; &lt;strike&gt; Этот текст в тегах strike &lt;/strike&gt;&lt;br&gt; &lt;s&gt; Этот текст в тегах s &lt;/s&gt; &lt;/body&gt; &lt;/html&gt;





Тег q

Теги <q></q> выделяют короткие цитаты. Все браузеры, кроме Internet Explorer, отображают их в кавычках.

Пример кода:
&lt;html&gt; &lt;head&gt; &lt;title&gt;Заголовок документа&lt;/title&gt; &lt;/head&gt; &lt;body&gt; Линкольн любил говорить: &lt;q&gt;Не достигает цели тот, кто от нее отказывается.&lt;/q&gt; &lt;/body&gt; &lt;/html&gt;





Теги big и small

Теги <big></big> выводят текст большего размера, чем остальная часть текста. Теги <small></small> выводят текст меньшего размера, чем остальная часть текста.

Пример кода:
&lt;html&gt; &lt;head&gt; &lt;title&gt;Заголовок документа&lt;/title&gt; &lt;/head&gt; &lt;body&gt; &lt;big&gt; Этот текст в тегах big &lt;/big&gt;&lt;br&gt; Это просто текст&lt;br&gt; &lt;small&gt; Этот текст в тегах small &lt;/small&gt; &lt;/body&gt; &lt;/html&gt;





Тег blink

Теги <blink></blink> отображают мигающий текст. Этот тег поддерживается только браузером Netscape, поэтому использовать его не рекомендуется. Кроме того, мигающий текст раздражает пользователей. 

Пример кода:
&lt;html&gt; &lt;head&gt; &lt;title&gt;Заголовок документа&lt;/title&gt; &lt;/head&gt; &lt;body&gt; &lt;blink&gt; Этот текст будет мигать. &lt;/blink&gt; &lt;/body&gt; &lt;/html&gt;


Тег hr

Тег <hr> рисует горизонтальную линию, отделенную сверху и снизу пустыми строками. У этого тега есть следующие параметры:

align - выравнивает линию по центру (center), слева (left) или справа (right).

width - устанавливает длину линии в пикселах или в процентах от ширины окна.

size - устанавливает толщину линии в пикселах.

color - устанавливает цвет линии.

noshade - убирает рельефность линии.

Пример кода:
&lt;html&gt; &lt;head&gt; &lt;title&gt;Заголовок документа&lt;/title&gt; &lt;/head&gt; &lt;body&gt; Линия без параметров &lt;hr&gt; Линия по центру &lt;hr align="center" color="red" size=2 width=50%&gt; Линия слева &lt;hr align="left" color="blue" size=3 width="150"&gt; &lt;/body&gt; &lt;/html&gt;





Тег pre

Теги <pre></pre> используются тогда, когда необходимо отобразить текст так, как он набран. Вы, наверно, заметили, что сколько бы пробелов вы не сделали в коде, на экране всегда отображается только один. Остальные игнорируются, что не всегда удобно. Например, при отображении стихов хочется сохранить все отступы и пробелы. В этом случае и используются теги <pre></pre> 

Пример кода:
&lt;html&gt; &lt;head&gt; &lt;title&gt;Заголовок документа&lt;/title&gt; &lt;/head&gt; &lt;body&gt; &lt;pre&gt; Как набрали, так и отображается. &lt;/pre&gt; &lt;/body&gt; &lt;/html&gt;





На этом четвертый урок закончен. Мы рассмотрели достаточное количество тегов для того, чтобы оформить текст так, как душе угодно. 

На следующем уроке мы будем рассматривать специальные символы. 
Категория: Уроки html | Добавил: Pikal (21.12.2011)
Просмотров: 424 | Рейтинг: 0.0/0
Всего комментариев: 0
Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]