Теги base и link
Тег <base> позволяет явно указать базовый URL-адрес, который будет использоваться в случае применения относительных ссылок на другие HTML-документы и прочие ресурсы. Тег <base> содержит атрибут href, значением которого является базовый URL-адрес и имеет формат:
<base href=”URL-адрес”>
Пример:
<html>
<head>
<base href=”//leonov.pochta.ru/images”>
</head>
<img src=”picture.jpg”>
</html>
В этом примере графическое изображение имеет относительную ссылку только в виде имени файла. Если базовый URL-адрес не был бы указан, то браузер искал бы файл picture.jpg в той же папке, где расположен HTML-документ со ссылкой на него. При задании базового URL-адреса браузер будет искать графический файл в папке /images на сайте leonov.pochta.ru.
Тег <link> предназначен для обозначения связей между документами в больших и сложных по своей структуре узлах. Он имеет атрибуты href и rel. Атрибут href содержит ссылку на другой документ, связанный с текущим. Адрес в ссылке может быть абсолютным или относительным. Атрибут rel указывает отношение между документами и может принимать следующие основные значения:
home – расположение домашней страницы Web-узла;
next – расположение следующего документа серии, связанной с текущим;
previous – расположение предыдущего документа серии, связанной с текущим;
up – расположение следующего документа вверх по иерархии;
copyright – расположение документа с информацией об авторских правах для данного Web-узла;
stylesheet – расположение файла с таблицей стилей:
Пример: <link rel=”stylesheet” href=http://mysite.ru/styles/mystyle.css>
В одном и том же HTML-документе тег <link> может присутствовать несколько раз.
Контейнеры body, div и span
Контейнерный тег <body> содержит основной раздел HTML-документа, включающий текст, ссылки, графические, звуковые, другие объекты и размещается вне раздела заголовка. Пример:
<html>
<head>
… теги заголовка
</head>
<body>
… теги основного раздела
</body>
</html>
Использование тега <body> не обязательно, но он имеет следующие атрибуты, с помощью которых можно задать параметры сразу для многих элементов, содержащихся в <body>:
alink – цвет активной ссылки;
link – цвет еще неиспользованной (непросмотренной) ссылки;
vlink – цвет уже использованной (епросмотренной) ссылки;
text – цвет текста;
bgcolor – цвет фона документа;
background – URL-адрес графического изображения, используемого в качестве фона документа;
7-10) leftmargin, rightmargin, topmargin, bottommargin – ширина в пикселах левого, правого, верхнего и нижнего полей (отступов) документа соответственно;
11) bgproperties – отказ от прокрутки фонового изображения, если установлено значение fixed (bgproperties= fixed);
12) scroll – установка (при значении yes) или удаление (при значении no) полос прокрутки браузера.
Эти атрибуты необязательны. По умолчанию браузер заполняет фон сплошным цветом в зависимости от настройки пользователя.
Значение цвета задается либо именем цвета, либо шестнадцатеричным числом в формате #XXXXXX, где X – шестнадцатеричная цифра. При этом используется модель RGB представления цвета: первые две цифры задают яркость красной (Red), вторые две цифры – зеленой (Green), а последние две цифры – синей (Blue) составляющей цвета. Каждая составляющая цвета может иметь одно из 256 значений (оттенков). Например, черному цвету соответствует значение #000000 (все составляющие имеют минимальную яркость); белому цвету соответствует значение #ffffff (все составляющие имеют максимальную яркость); если значения яркости всех трех составляющих цвета одинаковы, то получается серый цвет определенного оттенка. Рассмотрим 2 примера задания красного цвета для текста и желтого для фона:
<body text=red bgcolor=yellow>
<body text=#ff0000 bgcolor=#ffff00>
Таблица часто употребляемых имен цветов и их шестнадцатеричных представлений имеет следующий вид:
Цвет |
Имя цвета |
Шестнадцатеричное Представление |
Черный |
Black |
#000000 |
Темно-синий |
Navy |
#000089 |
Серебристый |
Silver |
#C0C0C0 |
Синий |
Blue |
#0000FF |
Красно-коричневый |
Maroon |
#800000 |
Пурпурный |
Purple |
#800080 |
Красный |
Red |
#FF0000 |
Малиновый |
Fuchsia |
#FF00FF |
Зеленый |
Green |
#008000 |
Темная морская волна |
Teal |
#008080 |
Ярко-зеленый |
Lime |
#00FF00 |
Морская волна |
Aqua |
#00FFFF |
Оливковый (желто-зеленый) |
Olive |
#808000 |
Серый |
Gray |
#808080 |
Желтый |
Yellow |
#FFFF00 |
Белый |
White |
#FFFFFF |
Контейнерные теги <div> и <span> служат для выделения фрагмента документа и задания его общих параметров. Контейнер <div> может содержать различные элементы (текст, графические изображения, ссылки, объекты и т.п.), а <span> обычно применяется к фрагментам текста.
Общие параметры для элементов, включенных в данные контейнеры, обычно назначаются с помощью таблиц стилей, используя тег <style> или атрибут style. В частности, можно задать произвольное относительное положение фрагментов документа, в том числе и наложение их друг на друга, имитируя создание слоев. Тег <div> имеет атрибут align с возможными значениями center, left и right, позволяющий выровнять весь фрагмент документа по центру, левому и правому края окна браузера соответственно. Рассмотрим пример, в котором фрагмент документа содержит два изображения и выравнивается по центру окна:
<html>
<head><title> Пример </title></head>
<body>
Пример использования контейнера:
<div align=center>
<img src=”picture1.jpg”>
<img src=”picture2.jpg”>
</div>
</body>
</html>