Цветовая гамма html-документа.
Цветовая гамма HTML-документа определяется атрибутами, размещенными внутри метки <BODY> . Вот список этих атрибутов:
Атрибут |
Функция |
bgcolor |
Определяет цвет фона документа. |
text |
Определяет цвет текста документа. |
Кроме того, метка <BODY> может включать атрибут background="[имя файла]" , который задает изображение, служащее фоном для текста и других изображений. Как и любое другое изображение, фон должен быть представлен в формате GIF (файл с расширением *.gif ) или JPEG (файл с расширением *.jpg или *.jpeg ).
Браузеры заполняют множественными копиями изображения-фона все пространство окна, в котором открыт документ, подобно тому, как при строительстве большие пространства стен покрывают маленькими (и одинаковыми) плитками.
Важно отметить, что цвет фона и изображение-фон никак не отображаются на бумаге при выводе HTML-документа на печать. Из этого есть одно важное практическое следствие: старайтесь не использовать текст белого цвета .
Имя |
код |
Имя |
Код |
Blaсk (черный) |
“#000000” |
Green (зеленый) |
“#008000” |
Silver (серебристый) |
“#C0C0C0” |
Lime (лимонный) |
“#00FF00” |
Gray (серый) |
“#808080” |
Olive (оливковый) |
“#808000” |
White(белый) |
“#FFFFFF” |
Yellow (желтый) |
“#FFFF00” |
Maroon (бордовый) |
“#800000” |
Navy (тёмно-синий) |
“#000080” |
Red (красный) |
“#FF0000” |
Blue (голубой) |
“#0000FF” |
Purple (фиолетовый) |
“#800080” |
Teal (темно-зелёный) |
“#008080” |
Fuchsia(фукцированный красный) |
“#FF00FF” |
Aqua (бело-голубой ) |
“#00FFFF” |
Изображения в html-документе.
Как интересный журнал или проспект теряет в своей привлекательности без цветных иллюстраций, так любой HTML-документ кажется сухим и невзрачным без использования графики. Значение графических изображений в аспекте создания электронных документов нельзя переоценить: реклама и коммерческие предложения компаний и юридических лиц становятся более выразительными и яркими, иллюстрации и схемы способны превратить скучный перечень услуг или расценок в интересный информативный материал, любой художественный рассказ или произведение будет восприниматься легче и естественнее при наличии картинок или фотографий.
Встроить изображение в HTML-документ очень просто. Для этого нужно только иметь это самое изображение в формате GIF (файл с расширением *.gif ) или JPEG (файл с расширением *.jpg или *.jpeg ) и одну строчку в HTML-тексте.
Допустим, нам нужно включить в документ изображение, записанное в файл picture.gif находящийся в одном каталоге с HTML-документом. Тогда строчка будет вот такая:
<IMG SRC="имя файла"> Здесь слово IMG (Image) означает изображение, а параметр
SRC (Source)-источник.
<IMG SRC="picture.gif">
В качестве источника необходимо указать имя файла с изображением. Разумеется, если файл находится в другой, нежели страница, директории, то надо указать его местоположение. Изображение будет размещено в том месте на странице, где находится ярлык.Метка <IMG SRC="[имя файла]"> может также включать атрибут ALT="[текст]" , например: <img src="C:\Documents and Settings\All Users\Документы\Мои рисунки\Образцы рисунков\Закат.jpg" ALT="Картинка">
Встретив такую метку, браузер покажет на экране текст Картинка и начнет загружать на его место картинку из файла picture.gif . Атрибут ALT может оказаться необходимым для старых браузеров, которые не поддерживают изображений, а также на случай, если у браузера отключена автоматическая загрузка изображений (при медленном подключении к Интернет это делается для экономии времени).
Файл, содержащий изображение, может находиться в другом каталоге или даже на другом сервере. В этом случае стоит указать его полное имя .
Параметры HSPACE и VSPACE- определяет размер горизонтального и вертикального отступов от встраиваемого изображения до текста. Формат записи значений-в пикселях. По умолчанию, значения обоих типов отступа равно нулю.
Параметры тэга <IMG> может включать следующие атрибуты:
Атрибут |
Функция |
SRC= “файл” |
Указание пути к встраиваемому изображению |
BORDER= “n” |
Указание рамки рисунка |
WIDTH=n(%) |
Определение ширины изображения |
HEIGHT=n(%) |
Определение высоты изображения |
ALIGN |
Указание типа выравнивания рисунка |
HSPACE=n |
Определение горизонтального отступа между рисунком и текстом |
VSPACE=n |
Определение вертикального отступа между рисунком и текстом |
ALT |
Указание альтернативного текста |
TITLE |
Создание информационной подсказки к изображению |
Пример 3.
<html>
<title> Пример
</title> <body bgcolor="Red"><h1><font color="green">
Электронные услуги в здравоохранении.</h1>
<font color="red"> <img src="C:\Documents and Settings\All Users\Документы\Мои рисунки\Образцы рисунков\Закат.jpg" align="left" border="1" width=50% ><нspace="20" vspace="20"><b>Базовые услуги Электронного правительства в соответствие с основными сферами жизнедеятельности граждан. Социальная защита и занятость населения. Образование, наука и здравоохранение.</b></br></BODY></html>
Теперь о фоновой картинке. Фоном может быть как большой графический файл (учтите - в этом случае страничка будет грузиться дольше) так и его фрагмент, что более разумно. При использовании последнего он будет автоматически размножен Вашим Обозревателем, поэтому подбирайте фрагмент хорошо стыкующимся. Вставить в страницу фоновую картинку можно так: <BODY BACKGROUND="images.gif"> Параметру BACKGROUND присвоено значение images.gif - это имя графического файла с расширением (поддерживаются *.jpg, *.gif, *.png). Естественно оно может быть другим. Предпологается, что графический файл расположен в одной папке с Вашим документом, иначе нужно указать к нему путь. Разберемся с путями на примере файла images.gif.
Пример 4.
<html>
<title>Пример
</title>
<body BACKGROUND="C:\Documents and Settings\003\Рабочий стол\13.JPG"><h1><font color="green">
Электронные услуги в здравоохранении.</h1></font>
<font color="red">
<img src="C:\Documents and Settings\003\Рабочий стол\123.jpg" align="left" border="1" width=50% ><Hspace="20" vspace="20"><b>
Базовые услуги Электронного правительства в соответствие с основными сферами жизнедеятельности граждан. Социальная защита и занятость населения.
Образование, наука и здравоохранение.</b></br></BODY></html>
