Сплошной фон

В CSS еще больше возможностей по работе с фоновыми рисунками, чем в старом и понятном HTML. HTML позволяет задать сплошной цвет фо­на и фоновый узор для всей страницы. Таким образом, существует два способа задания тек­стуры каждой страницы еще до того, как вы что-либо на ней разместите. Это как покупать бумагу для принтера с уже напечатанными шаблонами фоновых изображений или таблиц.

Вдобавок, если вы используете один и тот же фоновый узор на всех страницах сайта, вы по­лучите преимуществ благодаря свойству браузера кешироватъ изображение. После того как изображение уже было загружено, браузер сохранит его в памяти. В следующий раз браузер бы­стро воспроизведет это изображение из памяти, вместо того, чтобы перезагружать его снова.

С помощью HTML совсем несложно добавить фоновый узор или сплошной фон на Web-страницу. Для этого нужно просто дописать два атрибута тега <body>.

<html>

<head>

<title>Использование фоновых цветов и надписей</title>

</head>

<body bgcolor= и#FF9900" background=”tilename.gif">

</body>

</html>

В теге <body> цвет фона задается атрибутом bgcolor, значение которого равно #FF9900. Это шестнадцатеричное число, соответствующее выбранному цвету фона страни­цы. За bgcolor следует атрибут background. Этот атрибут определяет имя файла, исполь­зуемого в качестве узора на странице (в данном случае tilename.gif). Не стоит забывать, что возможности задания графических элементов в HTML весьма ограничены по сравнению с CSS. В конечном счете HTML — это лишь контейнер.

При использовании фоновых узоров следует серьезно отнестись именно к моза­ичным узорам. Суть такого узора в том, что он повторяется и образует мозаику. Размер узора разработчик выбирает произвольный. На самом деле, многие ди­зайнеры делают узор гораздо большего размера, чем сама Web-страница. Таким образом, вы получаете полный контроль над дизайном, так как узор не повторится до тех пор, пока не выйдет за границы экрана, и пользователь уже не уви­дит этого повторения.

Карты-изображения

Обычно с одним изображением связана только одна ссылка. Для того чтобы с изображе­нием связать множество ссылок, применяются карты-изображения. Карта-изображение имеет два обязательных компонента.

Атрибут usemap тега <img>. Значением атрибута usemap является ссылка на описание конфигурации карты (в данном случае #nameof map).

Контейнерный тег <map>, внутри которого расположены координаты ак­тивных областей изображения.

Ниже приведен пример кода.

<img srс="image.jpg" width="100" height=H80" border="0" ^usemap-"#nameofmap">

<map name="nameofmap">

<area shape="rect" cords="40,50,130,120" href="/page3.htm">

<area shape="rect" cords="20,15,60,35" href="/page4.htm">

<area shape="rect" cords="7,50,45,100" href="/page5.htm">

</map>