Использование цвета и графики

Использование цветового выделения часто используется в Web-документах. Почти каждый элемент имеет цветовой атрибут. Значения цветовых параметров приводились во 2-ой части пособия на примере изменения цвета шрифта. Однако можно изменить шрифт фона документа. Для этого используйте параметр bgcolor тэга <body>:

В Блокноте В браузере

<body bgcolor="Teal"> <big>Глава I</big> </body>

Глава I

Вы также можете повысить интерес к своему документа, сделав подложку не одним цветом, а текстурой. Текстура - это небольшое изображение, которым "мостят" фон, т.е. оно многократно копируется как по вертикали, так и по горизонтали. Для создания текстур, обычно, применяют специальные графические редакторы, в котых есть инструменты создания текстур - текстуризаторы. Однако можно создать текстуру с помощью простых редакторов и инструментов, соблюдая следующие правила:

1. Рисунок не должен быть очень контрастным, т.е. пестрым

2. Рисунок либо не должен обрываться на границе, либо его границы должны "сшиваться"

3. Если рисунок яркий, то шрифт документа должен быть темным и наоборот

4. Размер "плитки" текстуры выбирайте в пределах от 3х3 до 5х5 см при разрешении 38 пиксел/см

Текстурный рисунок должен быть сохранен в формате GIF или JPG. После чего, его надо указать в параметре background тэга <body>:

В Блокноте В браузере

<body background="textura1.jpg"> <big>Пример "светлой" текстуры</big> </body>

Пример "светлой" текстуры

<body background="textura2.jpg"> <big>Пример "темной" текстуры</big> </body>

Пример "темной" текстуры

Изображение можно вставить в текст. Это поможет "оживить" Web-документ, сделать его мультимедийным. Для это используйте тэг <img> с параметрами:

Параметр	Описание (Значения)
`src=`	Адрес URL файла с графическим изображением (формат `GIF` или `JPG`)
`alt=`	Текстовая строка, отображаемая вместо изображения, если графический файл отсутствует или когда отображение графики отключено
`align=`	Выравнивание текста относительно изображения ( `"left"`-по левой границе, `"right"`-по правой границе, `"top"`-по верхней границе, `"bottom"`-по нижней границе, `"middle"`-по центру изображения)
`height=`	Высота изображения в пикселах
`width=`	Ширина изображения в пикселах
`hspace=`	Ширина просвета между изображением и текстом по горизонтали в пикселах или в % от ширины окна
`vspace=`	Ширина просвета между изображением и текстом по вертикали в пикселах или в % от ширины окна
`border=`	Ширина рамки вокруг изображения в пикселах

В Блокноте В браузере

<img src="photo.gif" width="14%" hspace="5" vspace="5" alt="Гурьян Л.В." align="top"> Пример изображения в формате GIF <img src="dune.jpg" width="14%" hspace="15" vspace="15" alt="Дюны" align="middle" border="2"> Пример изображения в формате JPG

Пример изображения в формате GIF

Пример изображения в формате JPG