«Форматирование текста в HTML» – четвертый урок учебника HTML. В этом уроке мы разберем основы форматирования текстов в HTML.Форматирование в HTML имеет ряд особенностей, которые мы с вами и рассмотрим.
Теги форматирования текста в HTML.
Для придания тексту смысловой нагрузки используются специальные теги форматирования. Одним из наиболее значимых тегов форматирования теста в html является тег параграфа (<p>). Для усиления смысловой нагрузки используются теги <strong> – сильное увеличение смысловой нагрузки (жирный текст) и <em> – среднее увеличение смысловой нагрузки (курсивный текст).
Написанное здесь очень важно так как именно увеличение смысловой нагрузки дают эти теги, а не просто жирное или курсивное выделение в отличии от тегов <b> (жирный текст) и <i> (курсивный текст). А вот как отобразить текст это уже дело браузера... ну здесь, как вы уже наверное понимаете, большинство браузеров предпочитает выделять текст жирным или курсивом. Визуально нет никаких отличий, но зато есть большая разница для поисковых машин.
Не менее важными тегами форматирования текста можно считать теги <br> и <nobr>.
Тег <br> позволяет разорвать строку с текстом, продолжив написание текста с новой строки. Атрибут clear в теге <br> используется для отмены обтекания текстом объекта, расположенного рядом с текстом. В этом случае текст продолжается с первой новой строки после объекта.
Тег <nobr> означает написание текста без разрыва строки, даже если он не умещается на ширину экрана (в этом случае внизу экрана появится полоса прокрутки).
Использование тега PRE.
К одной из особенностей форматирования html относится то, что если вы скопируете текст из другого текстового редактора (например MS Word), то форматирование текста не будет сохранено. Для копирования текста из текстового редактора с сохранением форматирования используется тег <PRE>:
<pre>
Это
предварительно форматированный текст.
Он сохраняет как пробелы в любом колличестве,
так и переносы строк.
</pre>
Заголовки.
Еще одним очень важным элементом форматирования текста является использование заголовков. Заголовки бывают 6–ти основных уровней от H1 (самый большой) до H6 (самый маленький). Увидеть каждфй из них вы сможете в таблице:
Уровень заголовка
Вид
h1
h1
h2
h2
h3
h3
h4
h4
h5
h5
h6
h6
Выравнивание элементов .
Для выравнивания элементов используется тег align, который может принимать следующие значения :
Значение
Вид
justify
Выравнивание текста по ширине
left
Выравнивание по левому краю
right
Выравнивание по правому краю
center
Выравнивание по центру
К примеру, для выравнивания текста по ширине страницы используется следующий код:
<p align="justify">Этот текст будет отформатирован по ширине страницы</p>
Форматирование шрифта.
Для форматирования шрифта используется тег Font, который имеет ряд атрибутов, которые позволяют придать тексту определенный шрифт, размер и цвет:
Значение
Вид
face
Позволяет изменить шрифт
color
Позволяет выбрать цвет
size
Задает размер букв
В приведенной ниже таблице вы можете увидеть шестнадцетиричные коды основных цветов, также называемых безопасной web палитрой. Проще говоря данные цвета будут отображаться одинаково, вне зависимости от версии браузера и модели монитора:
цвет
шестнадцатеричное представление
aqua
#00FFFF
black
#000000
blue
#0000FF
fuchsia
#FF00FF
gray
#808080
green
#008000
lime
#00FF00
maroon
#800000
navy
#000080
olive
#808000
purple
#800080
red
#FF0000
silver
#C0C0C0
teal
#008080
white
#FFFFFF
yellow
#FFFF00
Ну и небольшой пример:
<font face="verdana" color="red" size="1">
Я красный текст шрифта verdana размером 1
</font>
Теперь мы научились форматировать текст в HTML, используя основные теги форматирования.
Следующий урок будет очень важен, т.к. в нем речь пойдет о работе с гиперссылками. Гипертекстовые переходы - основа web документов, поэтому отнеситесь к предстоящему уроку максимально серьезно.