| Internet Explorer | Chrome | Opera | Safari | Firefox | Android | iOS | |
| 7.0 | 8.0+ | 1.0+ | 1.0+ | 1.0+ | |||
Коротка інформація
| Значення за замовчуванням | 0 |
|---|---|
| Успадковується | Ні |
| Процентне запис | Так |
| Застосовується | До всіх елементів |
Версії CSS
| CSS 1 | CSS 2 | CSS 2.1 | CSS 3 |
|---|---|---|---|
Опис
Встановлює позицію фонового зображення всередині елемента по вертикалі. Властивість background-position-y є нестандартною та не входить до специфікації CSS.
Синтаксис
background-position-y: top | center | bottom | відсотки | значення
Значення
- top
- Вирівнює фон по верхньому краю. Еквівалент запису 0 або 0%.
- center
- Вирівнює фон по центру вертикалі. Еквівалент запису 50%.
- bottom
- Вирівнює фон по нижньому краю. Еквівалент запису 100%.
- відсотки
- Встановлює позицію фону в відсотках від висоти елемента. Значення 0% або 0 вирівнює верхній край фонового зображення по верхньому краю елемента. Значення 100% вирівнює нижній край зображення по нижньому краю елемента.
- значення
- Встановлює позицію фону в будь-яких доступних для CSS одиницях - пікселі (px), сантиметри (cm), em і ін. відносно верхнього краю елемента.
Приклад
HTML5CSS2.1CSS3IECrOpSaFx
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>background-position-y</title>
<style>
html {
height: 100%; /* Висота сторінки */
}
body {
background: url(images/mybg.png) no-repeat; /* Параметри фону */
background-position-y: bottom; /* Позиція фону */
}
</style>
</head>
<body>
<p>...</p>
</body>
</html>Результат цього прикладу показаний на рис. 1.
Об'єктна модель
[window.]document.getElementById("elementID").style.backgroundPositionY