Урок 4: Дальше работаем с текстом
Для придания тексту того или иного вида в html используют следующие элементы:
- STRONG |
Применяется чтобы выделить текст жирным |
- EM |
Применяется чтобы выделить текст курсивом |
- U |
Используется для подчеркивания текста |
- S |
Используется для перечёркивания текста |
- SUP |
Применяется для создания верхнего индекса |
- SUB |
Применяется для создания нижнего индекса |
- FONT |
Он нужен чтоб измененить типа, цвет и размер шрифта |
- HR |
Для вставки в текст горизонтальную разделительную линию |
STRONG - Выделяет текст жирным шрифтом, расположенный между открывающим тегом <strong> и закрывающим тегом </strong> . Ранее все использовали тег <BOLD> (или <b> ), вообще-то и сейчас им можно пользоваться , но его не приветствуют поисковые системы.
Если в теле документа прописать:
<strong> Этот текст будет выделен жирным </strong> <br>
<b> И этот тоже, но этим тегом лучше не пользоваться! </b>
Увидим в браузере:
Как видите, действуют оба этих тега одинаково. В программе Adobe Dreamweaver на панели форматирования текста стоит "B"
(попросту название это более старое и многие веб-мастера к нему привыкли ), хотя нажав на эту кнопку в коде ставится тег <strong> .
↑ Вверх ↑
EM ( Emphasis ) - Выделяет текст курсивом, расположенный между открывающим и закрывающим тегами. Хотя по действию тег <I> аналогичен с ним , однако им лучше не пользоваться, всё также из-за нелюбви к нему поисковых систем.В программе Adobe Dreamweaver на панели форматирования текста стоит "I" хотя в коде ставится тег EM.
Вот пример:
<em> Этот текст будет выделен курсивом </em> <br>
<i> И этот тоже, но лучше пользоваться тегом EM</i>
Увидим в браузере:
U(Underline) - Отображает текст подчеркнутым расположенный между открывающимтегом<u> и закрывающим тегом </u>:
Если в теле документа прописать:
<u> Этот текст будет подчеркнутым!!! </u>
В браузере увидим:
S(Strike) - Текст будет перечеркиваться, расположенный между открывающим тегом <s> и закрывающим тегом</s>.
Вот пример:
Вниманиe акция! новая цена <s> 50 000 </s> 20 000 рублей!
Получилось:
SUP ( Superscript) - Отображает верхний индекс от основного текста, также расположенный между открывающим тегом<SUP> и закрывающим тегом</SUP>.
Вот пример:
2 <sup> 2 </sup> = 4 ;<br>
2 <sup> 3 </sup> = 8 ; <br>
2 <sup> 4 </sup> = 16 ;
И получаем:
↑ Вверх ↑
SUB(Subscript) - Отображает нижний индекс от основного текста, расположенный между открывающим тегом <SUB> и закрывающим тегом</SUB>.
Вот пример:
Формула спирта в химии - С <sub> 2 </sub> Н <sub> 5 </sub> ОН
В браузере видем:
↑ Вверх ↑
FONT - Позволяет изменять тип, размер, цвет и шрифт текста, расположенного между открывающим тегом <font> и закрывающим тегом </font>.
Атрибуты:
SIZE - Распознает размер шрифта. Существующие значение - 1 , 2 , 3 , 4 , 5 , 6 , 7.
COLOR - Распознает цвет текста. Задается одним из 16 базисных цветовили RGB-значением в шестнадцатиричной системе
FACE - Распознает используемый шрифт. Используйте Arial, Times New Roman,Tahoma, Courier, Courier New. Они стоят у многих. По-другому гарантий не будет!
Если в теле документа прописать:
Это обычный текст <br>
<FONT SIZE="+2" COLOR="red"> Увеличенный красный шрифт</FONT>
<br>
<FONT SIZE="3" FACE="Courier New" COLOR="Violet">
Моноширинный фиолетовый текст 3 размера</FONT>
В браузере при просмотре увидим:
Примечание: В последующим (после изучения css) лучше всегда делать все что связано с размером, типом и цветом шрифта через таблицы стилей. Это намного удобнее, кроме того многие элементы форматирования текста находящееся внутри атрибута FONT, работают некорректно.
HR- предназначен для вставки горизонтальной линии в текст. Нет закрывающего тега !
Атрибуты:
WIDTH – задает длину линии от ширины окна браузера в процентах или пикселах.
SIZE – определяет в пикселах толщину линии.
ALIGN – задает выравнивание линии по горизонтали. Атрибут принимает разные значения:
right – выравнивает по правому краю документа.
left – выравнивает по левому краю документа.
center – выравнивает по центру документа (используется по умолчанию).
NOSHADE – задает сплошной способ закраски линии. Атрибут является "флагом" и указания значения не требует. Без этого атрибута линия показывается объемной.
COLOR – определяет цвет линии. Можно использовать или один из 16 базисных цветов, или RGB-значение в шестнадцатиричной системе. Атрибут работает только лишь в Internet Explorer.
Пример:
Текст до линии <hr noshade width="50%" align="left"> После линии <br>
А вот пример линии толщиной 2px и без флага noshade
<hr width="50%" align="left" size ="2">
Что мы увидим:
См.также
Следующий - Урок 5: Завершаем работу с текстом
Предыдущий - Урок 3: Разбираемся с текстом