Добавил:
Upload Опубликованный материал нарушает ваши авторские права? Сообщите нам.
Вуз: Предмет: Файл:
Введение в Веб программирование.doc
Скачиваний:
81
Добавлен:
07.11.2018
Размер:
4.42 Mб
Скачать

Цвет и фон.

Свойство

Описание

Сolor

Определяет цвет элемента.

background

Задает свойства фона элемента страницы. Значения:

[{background-color}] [{background-image}] [{background-repeat}] [{background-attachment}] [{background-position}];

background-color

Задает фоновый цвет страницы или ее элемента: {Цвет}|transparent;

Предопределенное значение transparent задает "прозрачный" фон.

background-image

Задает фоновый рисунок Web-страницы или ее элемента.

url({Интернет-адрес файла рисунка})|none; Предопределенное значение none отключает фоновый рисунок.

background-attachment

позволяет "зафиксировать" фоновый рисунок, чтобы он не прокручивался вместе с содержимым страницы. Применяется для тега <BODY>: croll|fixed; scroll – обычное фоновое изображение , fixed – фоновое изображение фиксируется и не прокручивается.

background-repeat

Устанавливает порядок повторения фонового рисунка на Web-странице или ее элементе: repeat|no-repeat|repeat-x|repeat-y;

repeat – размножает фоновое изображение во всех направлениях (по умолчанию); no-repeat – запрещает изображению повторяться; repeat-x – размножает изображение только по горизонтали;

repeat-y – размножает фоновое изображение только по вертикали.

background-position

Задает местонахождение фонового рисунка и заменяет атрибуты

[{background-position-x}] [{background-position-y}];

Если задана только одна координата, она считается горизонтальной, а для вертикальной принимается значение 50%. Значение по умолчанию 0% 0%.

background-position-x

Задает горизонтальную координату фонового рисунка. {X}|{X}%|left|center|right; Координата может быть задана целым числом, процентом от соответствующего размера фонового рисунка или предопределенным значением. Доступны три предопределенных значения: left, center, right, которые задают выравнивание фонового рисунка по левому краю, по центру и по правому краю. Значение по умолчанию 0%.

background-position-y

Задает вертикальную координату фонового рисунка.

{Y}|{Y}%|top|center|bottom; Координата может быть задана целым числом, процентом от соответствующего размера фонового рисунка или предопределенным значением. Доступны три предопределенных значения: top, center, bottom, которые задают выравнивание фонового рисунка на странице по верху, по центру и по низу страницы .


Пример color - указывает цвет текста элемента.

<html>

<head>

<title> Изменение цвета символов</title>

</head>

<body>

<p><span style="color: blue">Первое</sраn> слово в строке - синие.</р>

<р style="color: rgb(49, 151, 116)"><span style="color:#fе0">Желтое</sраn> слово в строке зеленого цвета.</р>

</body>

</html>

Пример background-color - определяет цвет фона элемента.

<html>

<head>

<title> Изменение цвета фона</title>

<style type="text/css">

. inverse {

font-family: Verana; /* Шрифт Verdana */

font-weight: bold; /* Жирное начертание */

background-color: green; /* Зеленый фон */

color: white; /* Символы белого цвета */

}

</style>

</head>

<body>

<div class=”inverse”>Белые буквы на зеленом фоне</div>

</body>

</html>

background - одновременно устанавливает свойства background-color, background-image, background-repeat, background-attachment и background-position.

Пример:

<html>

<head>

<style type="text/css">

body {

background:

white /* Цвет фона */

url(image.gif) /* Путь к файлу с рисунком фона */

left top /* Положение в левом верхнем углу */

no-repeat /* Не повторять рисунок */

fixed /* Зафиксировать фон */

}

</style> .

</head>

<body>

Использование стилей для добавления фонового рисунка на страницу

</body>

</html>