Для любого элемента можно присвоить фоновое изображение с помощью CSS свойства: background-image.
Возможные значения background-image:
url - путь к файлу с изображением.
none - изображение отсутствует. (по умолчанию)
Для того чтобы сделать некую картинку фоном для элемента необходимо указать к ней путь согласно следующего синтаксиса url(путь к файлу/имя файла). Путь к файлу указывается в том случае, если рисунок находится в другой папке.
В примере ниже в качестве основного фона (элемент body) используется одно графическое изображение, а для блока div другое, возможность использования различных фоновых изображений для разных элементов страницы позволяет решать практически любые дизайнерские задумки.
Пример:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Фоновое изображение</title>
<style type="text/css">
body{
background-image: url(fon.jpg);
}
div{
background-image: url(fon1.gif);
border: 5px double #245404;
height: 250px;
}
p{
text-align: center;
color: #008040;
font: bold 24px Arial;
}
</style>
</head>
<body>
<p>Страница с фоновым изображением</p>
<div><p>Блок с фоновым изображением</p></div>
</body>
</html>
Если рисунок не заполняет собой весь фон элемента, то он выкладывается "плиткой".