Войти
s-lub » Учебники » HTML » Оформление текстов в HTML (часть 2)

Оформление текстов в HTML (часть 2)

Оформление текстов в HTML (часть 2)

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

Основные и самые полезные форматирования текста:
- strong – делает жирный шрифт
- em – делает курсивный шрифт
- u – подчёркивает текст
- s – зачёркивает текст
- sup – создаёт верхний индекс
- sub – создаёт нижний индекс
- font – меняет размер, цвет и тип шрифта
- hr – вставляет в текст горизонтальную разделительную линию

Всё вышеперечисленные теги, кроме <hr>, необходимо закрывать.

Давайте сначала коротко поговорим о каждом из них, а потом рассмотрим их на одном, общем примере, ничего сложного в них нет.

STRONG

STRONG – весь текст заключенный в этот тег будет жирным, раньше использовали тег <BOLD> (или <b>), сейчас тоже ими можно пользоваться, но поисковые системы рекомендуют применять STRONG.

EM

EM ( Emphasis ) – предназначен для выделения текста курсивом, раньше использовали тег <I>, но поисковики рекомендуют использовать ЕМ.

U

U (Underline) – подчёркивает текст снизу, требует закрытия.

S

S (Strike) – текст помещенный между этими тегами будет зачёркнут.

SUP

SUP ( Superscript) - Отображает текст, заключенный между открывающим <SUP> и закрывающим </SUP> тегами, как верхний индекс от основного текста.

SUB

SUB(Subscript) - Отображает текст, заключенный между открывающим <SUB> и закрывающим </SUB> тегами, как нижний индекс от основного текста.

FONT

FONT - Позволяет изменять цвет, размер и тип шрифта текста, находящегося между открывающим <font> и закрывающим </font> тегами, необходимо использовать атрибуты:

SIZE - Определяет размер шрифта. Возможные значение - 1 , 2 , 3 , 4 , 5 , 6 , 7.

COLOR - Определяет цвет текста. Задается либо RGB-значением в шестнадцатиричной системе, либо одним из 16 базовых цветов.

FACE - определяет используемый шрифт. Используйте Times New Roman, Arial, Tahoma, Courier, Courier New. Можно использовать и другие шрифты, о они могут не корректно отображаться в некоторых браузерах.

HR

HR - служит для вставки в текст горизонтальной линии. В отличии от других элементов не требует закрывающего тега. Можно использовать атрибуты.

WIDTH – определяет длину линии в пикселах или процентах от ширины окна браузера. Если не использовать, то ширина линии будет ровняться ширине блока или экрана.

SIZE – толщина линии в пикселах, если не использовать то толщина будет 1 пиксель.

ALIGN – определяет выравнивание горизонтальной линии. Атрибут может принимать следующие значения:
- left – выравнивание по левому краю документа.
- right – выравнивание по правому краю документа.
- center – выравнивание по центру документа (используется по умолчанию).

NOSHADE – определяет способ закраски линии как сплошной. Атрибут является флагом и не требует указания значения. Без данного атрибута линия отображается объемной.

COLOR – задает цвет линии. Можно использовать либо RGB-значение в шестнадцатиричной системе, либо один из 16 базовых цветов. Атрибут работает только в Internet Explorer.

Примеры применения вышеуказанных элементов:

<strong> Этот текст будет выделен жирным </strong> <br>
<em> Этот текст будет выделен курсивом </em> <br>
<u> Этот текст будет подчеркнутым!!! </u> ;<br>
<s> Этот текст будет зачёркнут </s>;<br>
2 <sup> 2 </sup> = 4 ;<br>
С <sub> 2 </sub> Н <sub> 5 </sub> ОН<br>
<FONT SIZE="+2" COLOR="red"> Увеличенный красный шрифт</FONT><br>
<FONT SIZE="3" FACE="Courier New" COLOR="Violet">Моноширинный фиолетовый текст 3 размера</FONT><br>
<hr width="50%" align="center" size ="2">

Ниже приведены устаревшие, но ещё работающие элементы. <br>
<b> Этот текст так же будет выделен жирным </b> <br>
<i> И этот тоже, но лучше пользоваться тегом EM</i>

В итоге мы получим: