Опубликован: 31.10.2006 | Уровень: для всех | Доступ: платный
Лекция 3:

Параметры CSS для фона

< Лекция 2 || Лекция 3: 123 || Лекция 4 >
Параметр 'background-attachment'

Этот параметр определяет, будет ли фоновое изображение зафиксировано в определенном месте или будет перемещаться вместе со всей страницей.

Наследование: нет.

Может принимать следующие значения:

Значение Описание
Scroll Фоновое изображение перемещается, когда перемещается страница
Fixed Фоновое изображение не перемещается, когда перемещается страница

Пример:

body 
{ 
background-attachment: fixed;
background-repeat: repeat 
}
Параметр 'background-color'

Этот параметр задает фоновый цвет элемента.

Наследование: нет.

Может принимать следующие значения:

Значение Описание
color Значение color может быть названием цвета (red), значением rgb (rgb(255,0,0)) или шестнадцатеричным числом (#ff0000)
transparent Фоновый цвет является прозрачным

Пример:

h1
{ 
background-color: gray;
font-family: arial
}
Параметр 'background-image'

Данный параметр задает изображение в качестве фона.

Наследование: нет.

Может принимать следующие значения:

Значение Описание
url Путь доступа к изображению
none Фонового изображения нет

Пример:

body
{ 
background-image: url(http://www.intuit.ru/speciality/image.gif); 
background-repeat: repeat;
background-attachment: fixed
}

В тех случаях, когда изображение недоступно, необходимо задать цвет background-color, который будет использован.

Параметр 'background-position'

Этот параметр задает начальное положение фонового изображения.

Наследование: нет.

Может принимать следующие значения:

Значение Описание
top left 
top center
top right
center left
center center
center right
bottom left
bottom center
bottom right
Если определить только одно ключевое слово, то вторым значением подразумевается "center"
x-% y-% Первое значение является горизонтальной координатой, второе значение — вертикальной. Верхний левый угол — 0% 0%. Правый нижний угол — 100% 100%. Если определено только одно значение, то вторым значением подразумевается 50%.
x-pos y-pos Первое значение является горизонтальной координатой, второе значение — вертикальной. Верхний левый угол — 0 0. Единицами измерения могут быть пиксели (0px 0px) или любые другие единицы измерения CSS. Если определено только одно значение, то вторым значением подразумевается 50%. Можно смешивать % и эти координаты.

Пример:

body
{ 
background-image: url(http://www.intuit.ru/speciality/image.gif);
background-position: right top;
background-attachment: fixed
}

body
{ 
background-image: url(http://www.intuit.ru/speciality/image.gif);
background-repeat: no-repeat;
background-position: 100% 100%;
background-attachment: fixed
}
Параметр 'background-repeat'

Этот параметр определяет, каким образом будет повторяться фоновое изображение.

Наследование: нет.

Может принимать следующие значения:

Значение Описание
repeat

Фоновое изображение будет повторяться по вертикали и по горизонтали
repeat-x Фоновое изображение будет повторяться по горизонтали
repeat-y Фоновое изображение будет повторяться по вертикали
no-repeat Фоновое изображение будет выведено только один раз

Пример:

body
{ 
background-image: url(http://www.intuit.ru/departament/image.gif);
background-repeat: repeat;
background-attachment: fixed
}
< Лекция 2 || Лекция 3: 123 || Лекция 4 >
Илья Ардов
Илья Ардов

Добрый день!

Я записан на программу. Куда высылать договор и диплом?

Елена Сапегова
Елена Сапегова

После прохождения теоретической части пришло письмо об окончании теоретической части курса, будет ли практическая часть?

Зарина Каримова
Зарина Каримова
Казахстан, Алматы, Гимназия им. Ахмета Байтурсынова №139, 2008
Akiyev Begench
Akiyev Begench
Беларусь, Полоцк, полоцкий государственный университет