ZAQ32 - Форматирование текста

Форматирование текста.

Вот мы и подошли к одному из ключевых моментов в формировании содержательной части документов. То есть, мы поговорим о форматировании текста.

Просто набирать монотонно текст конечно можно, но такой экран просто не будет восприниматься визуально. Если вы размещаете информацию о каком-либо товаре, то желательно выделить заголовок товара, жирным или цветным шрифтом выделить какие-либо ключевые характеристики, чтобы покупатель продукта или просто посетитель сайта смог без труда понять, что это за продукт и для чего он необходим. HTML позволяет выделять, например, определения, адресную строку, подчеркивать текст …

Все это осуществляется несколькими способами.

Есть такой замечательный тэг, как font.
Какой то текст красного цвета
Как мы видим, вместе с тэгом font можно использовать следующие атрибуты:

size – указывает размер текста (значение может быть от 1 до 7. Можно писать и так: <font size="-3" или <font size="+1").
color – цвет текста.
face – шрифт текста. Да, с этим параметром будьте осторожны. Вдруг у пользователя в системе не будет установлен заданный вами шрифт. Поэтому, чтобы текст отображался корректно, лучше использовать стандартные шрифты, которые есть у всех (ну или почти у всех).

Идем дальше. Посмотрим, что еще можно сделать с текстом.

<basefont>

Тэг <basefont> - предназначен для определения основного шрифта документа. То есть, если вы задали <BASEFONT SIZE="2">, то весь текст будет выведен 2 шрифтом.

Листинг 5.
<BODY>
<BASEFONT SIZE="2" FACE="Arial" >
Определяем основной размер шрифта равный 2

увеличиваем размер на данном участке

Далее вновь текст размером 2
</BODY>

Достаточно в начале документа задать <BASEFONT SIZE="2" FACE="Arial"> и весь текст документа будет отображен шрифтом 2-го размера шрифтом arial. Да, важно обратить внимание на то, что тэг <basefont> не требует закрывающегося тэга.
Одно маленькое исключение. Форматирование текста документа при помощи данного тэга не распространяется на таблицы, которые содержатся в документы.

Стилевое форматирование.

- выделяет нужный вам фрагмент текста курсивом
- так называемое смысловое выделение текста, на деле же – мало чем отличается от обычного курсива.
- жирный текст
- так называемое усиленное выделение текста – тоже жирное выделение.
- подчеркнутый текст
<S> - перечеркнутый текст
<BIG> - увеличивает размер шрифта по сравнению с остальным шрифтом.
- уменьшает размер шрифта по сравнению с остальным.
- верхний регистр символов
- нижний регистр символов
<CODE> - форматирует текст, отображая его как программный код
<SAMP> - нечто аналогичное предыдущему тэгу
<TT> - режим, когда все буквы будут отображаться одинаковыми по ширине.
<KBD> - клавиатурный стиль. Чтобы узнать что это такое – попробуйте его использовать.
<VAR> - стиль отображения переменных – очень похож на обычный курсив.
<CITE> - обычно используется для выделения цитат. Тоже курсив, не несколько иной.
<BR-CLEAR> – обтекаемый текст
<BLOCKQUOTE> - текст с отступом, тоже удобен для публикации различных определений.

Листинг 6.
<BODY>
Обычный текст 
текст выделен курсивом 
смысловое выделение текста 
жирный текст 
усиленное выделение 
подчеркнутый текст 
<s>зачеркнутый текст</s> 
<big>увеличенный текст</big> 
уменьшенный текст 
верхний регистр 
нижний регистр 
<code>программный код</code> 
<samp>и это программного кода</samp> 
<tt>все буквы одинаковы по ширине</tt> 
<kbd>клавиатурный шрифт</kbd> 
<var>объявление переменных</var> 
<cite>цитата великого человека</cite> 
<img src = 1.gif>
Я взял фрагмент этой картинки не помню точно, из каких обоев, затем я скачал рисунок из Интернета, сократил его
 
и использовал в своем примере для создания обтекаемого текста 
<BLOCKQUOTE>Интернет - это одно из ключевых определений, используемое в глобальном мировом пространстве и трудно раскрыть его содержание всего в нескольких строках текста</BLOCKQUOTE> 
</BODY>

Результат должен быть следующим:

Рис. 5

Параграф.

Тоже достаточно интересная вещь. Для создания параграфом используется тэг: . Здесь же можно сразу выравнивать текст:
этот текст будет выровнен по правому краю
а этот текст будет выровнен по ширине

Бегущая строка.

Бегущая строка, хотя уже и не так популярна, но все равно используется время от времени. Вот и живой пример:
<marquee height="10" width="270" bgcolor="red">
Здесь будет бегущая строка, высота - 10, ширина - 270 пикселов, фон - red
</marquee>

Для тэга есть ряд атрибутов:

Direction –задает направление движения текста, может принимать следующие значения: left, right, up, down.
Пример: <marquee direction="left"> бегущая строка</marquee>
Behavior – задает варианты прокрутки строки. Атрибут также имеет ряд значений:
- Scroll – строка будет просто двигаться от начала и до конца.
- Slide – если данный параметр установлен, то строка дойдет до края и прокрутка остановиться.
- Alternate – строка будет перемещаться из одной стороны в другую.
Scrollamount - скорость движения строки, может принимать значения от 1 до 10.

На главную | К содержанию раздела

Используются технологии uCoz