
- •Форматирование текста
- •Цвет шрифта
- •Цвет фона документа
- •Работа с абзацами
- •Заголовки
- •Начертание шрифта
- •К одному фрагменту текста можно применять сразу несколько тегов.
- •Графические элементы размещение графических объектов
- •Гиперссылки
- •Текстовые ссылки
- •Ссылки внутри одного документа
- •Нумерованный список
- •Спецсимволы
- •Html - таблицы
Начертание шрифта
Для выделения определенных фрагментов текста, например, с целью обратить внимание посетителя на важную информацию или указать текст, являющийся примером программного кода, нередко используются такие параметры шрифта как полужирное или курсивное начертание, подчеркивание или зачеркивание. Кроме того, может возникнуть необходимость во включении в текст документа подстрочных или надстрочных индексов.
Для указания таких параметров предусмотрен ряд тегов:
<b> Символы </b> - полужирное начертание;
<i> Символы </i> - курсивное начертание;
<u> Символы </u> - подчеркнутый текст;
<s>
Символы
</s>
- зачеркнутый текст;
<pre> Символы (пробелы) символы </pre> - выводит фиксированный текст с точностью до пробела, как набрано в блокноте;
<sup> Символы </sup> - надстрочный индекс;
<sub> Символы </sub> - подстрочный индекс;
<big> Символы </big> - крупный шрифт относительно основного текста;
<small> Символы </small> - малый шрифт относительно основного текста.
Значение параметра face тега <font></font> определяет внешний вид шрифта в броузере. Например: <font face="ARIAL"> Текст (шрифт Arial) </font>.
К одному фрагменту текста можно применять сразу несколько тегов.
П
<html> <head> <title>Начертание
шрифта
</title> </head> <body
text="#000000" bgcolor="#00BECE"> <center> <H3>Добро
пожаловать на мою <br> <font
color="#CC0000">домашнюю </font>
страничку!</H3> </center> <p
align="justify"> Спасибо
Вам,
<tt><b><i>уважаемый </i></b></tt>
посетитель, за то, что Вы нашли время и
возможность заглянуть на мою домашнюю
<font size="+1"> страничку</font> во
Всемирной сети. </p> </body> </html>
ример:
Графические элементы размещение графических объектов
Язык HTML позволяет помещать на Web-страницы не только текстовые, но и графические элементы. Для размещения графических объектов используется непарный тег <img>. Если по каким либо причинам отображение иллюстрации невозможно, броузер подставит вместо него значение параметра alt (альтернативный текст) тега <img>. Параметр src тега <img> является обязательным и указывает полный адрес расположения графического файла.
Например: <img src=”hobbie.jpg”>. Расположенное между кавычками - ссылка (путь к картинке). Пример говорит о том, что картинка лежит в том же каталоге (директории, папке), в которой лежит документ.
П
<html> <head> <title>Размещение
графических объектов </title> </head> <body
text="#000000" bgcolor="#00BECE"> <p
align="justify"> <img
src="2.gif" alt="Здесь вставлена
картинка">
Спасибо
Вам, <tt><b><i>уважаемый </i></b></tt>
посетитель, за то, что Вы нашли время и
возможность заглянуть на моюдомашнюю
<font size="+1"> страничку
</font>во Всемирной сети. </p> </body> </html>
ример:
ВЫРАВНИВАНИЕ ГРАФИЧЕСКОГО ОБЪЕКТА ОТНОСИТЕЛЬНО ТЕКСТА
Параметр align тега <img> определяет режим выравнивания графического объекта относительно текста:
<img src = ”hobbie.jpg” align = ”left”> - это означает, что картинка прижата к левому краю экрана, а текст обтекает ее справа;
<img src = ”hobbie.jpg” align = ”right”> - картинка справа, текст слева;
<img src = ”hobbie.jpg” align = ”bottom”> - текст располагается внизу картинки (это по умолчанию);
<img src = ”hobbie.jpg” align = ”middle ”> - текст располагается посередине картинки;
<img src = ”hobbie.jpg” align = ”top ”> - текст располагается вверху картинки.
Существует еще несколько параметров тега <img>:
<img src = ”hobbie.jpg” Vspace = “10”> - параметр Vspace задает расстояние между текстом и рисунком по вертикали. Расстояние задается в пикселях;
<img src = ”hobbie.jpg” Hspace = “30”> - параметр Hspace задает расстояние между текстом и рисунком, но по горизонтали. Расстояние задается в пикселях;
<img src = ”hobbie.jpg” alt = “Мое хобби”> - параметр alt - краткое описание картинки;
<img src = ”hobbie.jpg” width = “100”> - параметр width - ширина самой картинки (в пикселях). Если ширину не задавать специально, то по умолчанию она будет равна реальной ширине картинки;
<img src = ”hobbie.jpg” height = “200”> - параметр height - высота самой картинки (в пикселях);
<img src = ”hobbie.jpg” border = “5”> параметр border - рамка вокруг самой картинки (в пикселях). Можно не задавать.
Все параметры могут употребляться одновременно друг с другом.
Пример:
<html> <head> <title>Выравнивание
графического объекта </title> </head> <body
text="#000000" bgcolor="#00BECE"> <p
align="justify"> <img
src="2.gif" align="left"
Vspace =3 Hspace
= 4 alt="Здесь вставлена картинка"> Спасибо
Вам, <tt><b><i>уважаемый </i></b></tt>
посетитель, за то, что Вы нашли
время и возможность заглянуть на мою
домашнюю <font size="+1">страничку </font>
во Всемирной сети. </p> </body> </html>
Параметр Background тега <body></body> задает адрес графического файла, используемого в качестве фона для HTML - страницы. Например: <body text=”#000000” Background = “фоновая_картинка.jpg”></body>, т. е. фоновая картинка, в нашем примере лежит в той же папке, что и документ.