Задает начальное положение фонового изображения, установленного с помощью параметра background-image. Применяется к блочным и заменяемым элементам.
Синтаксис
background-position: [проценты | значение] | [left | center | right] || [top | center | bottom]
У этого параметра два значения, положение по горизонтали (может быть — left, center, right) и вертикали (может быть — top, center, bottom). Кроме использования ключевых слов положение также можно задавать в процентах, пикселях или других единицах. Если применяются ключевые слова, то порядок их следования не имеет значения, при процентной записи вначале задается положение рисунка по горизонтали, а затем, через пробел, положение по вертикали. Отношение между используемыми ключевыми словами и процентной записью следующее.
top left = left top = 0% 0% (в левом верхнем углу)
top = top center = center top = 50% 0% (по центру вверху)
right top = top right = 100% 0% (в правом верхнем углу)
left = left center = center left = 0% 50% (по левому краю и по центру)
center = center center = 50% 50% (по центру)
right = right center = center right = 100% 50% (по правому краю и по центру)
bottom left = left bottom = 0% 100% (в левом нижнем углу)
bottom = bottom center = center bottom = 50% 100% (по центру внизу)
bottom right = right bottom = 100% 100% (в правом нижнем углу)
|
|
В скобках указано, где располагается фоновый рисунок относительно контейнера.
Background-repeat
Определяет, как будет повторяться фоновое изображение, установленное с помощью параметра background-image, и по какой оси. Можно установить повторение рисунка только по горизонтали, по вертикали или в обе стороны.
Синтаксис
background-repeat: no-repeat | repeat | repeat-x | repeat-y
no-repeat
Устанавливает одно фоновое изображение в элементе без его повторений, положение которого определяется атрибутом background-position (по умолчанию в левом верхнем углу).
repeat
Фоновое изображение повторяется по горизонтали и вертикали.
repeat-x
Фоновый рисунок повторяется только по горизонтали
repeat-y
Фоновый рисунок повторяется только по вертикали