Фон элемента. Списки

Каскадные таблицы стилей позволяют задать цвет фона или использовать изображение в качестве фона. Для фонового рисунка можно задать начальное положение и указать, будет ли рисунок прокручиваться вместе с содержимым веб-страницы. Кроме того, можно контролировать, как фоновый рисунок повторяется, что позволяет получить интересные спецэффекты. Например, если в качестве фонового рисунка указать градиентную полосу с высотой, равной высоте элемента страницы, и шириной, равной 1-2 мм, а затем задать режим повторения только по горизонтали, первоначальное изображение будет размножено по горизонтали, и мы получим градиентную полосу любой ширины.

Цвет фона

С помощью атрибута background-color можно задать цвет фона:

body { background-color: blue }
td { background-color: silver }

В качестве значения атрибута можно использовать слово transparent. Оно означает, что цвет прозрачный:

td { background-color: transparent }

Фоновый рисунок

С помощью атрибута background-image можно задать URL-адрес изображения, которое будет использовано в качестве фонового рисунка. Может быть указан абсолютный или относительный URL-адрес (относительно местоположения таблицы стилей, а не документа):

body { background-image:url(images/foto14.gif) }

В качестве значения атрибута можно использовать слово none. Оно означает, что фоновая заливка отключена:

body { background-image: none }

Режим повтора фонового рисунка

Атрибут background-repeat задает режим повтора фонового рисунка. Он может принимать следующие значения:

repeat —рисунок повторяется и по вертикали, и по горизонтали (по умолчанию);
body { background-image: url(images/foto14.gif); background-repeat: repeat }
repeat-x — рисунок повторяется по горизонтали;
body { background-image: url(images/foto14.gif); background-repeat: repeat-x }
repeat-y — рисунок повторяется по вертикали;
body { background-image: url(images/foto14.gif); background-repeat: repeat-y }
no-repeat — рисунок не повторяется:
body { background-image: url(images/foto14.gif); background-repeat: no-repeat }

Прокрутка фонового рисунка

Атрибут background-attachment определяет, определяет будет ли фоновый рисунок прокручиваться вместе с документом. Он может принимать следующие значения:

scroll —фоновый рисунок прокручивается вместе с содержимым страницы (по умолчанию);
body { background-image: url (images/foto14.gif); background-repeat: no-repeat; background-attachment:scroll }
fixed — фоновый рисунок не прокручивается;
body { background-image: url (images/foto14.gif); background-repeat: no-repeat; background-attachment: fixed}

Положение фонового рисунка

Атрибут background-position задает начальное положение фонового рисунка. В качестве значений атрибута задаются координаты в абсолютных единицах или процентах. Координаты указываются через пробел:

body { background-image: url(images/foto14.gif); background-repeat: no-repeat; background-attachment:scroll; background-position: 50% 50% }

Списки

Задать параметры списка можно не только с помощью параметров тегов, но и с помощью атрибутов стиля. Более того, каскадные таблицы стилей позволяют использовать в качестве маркера списка любое изображение.