CSS vlastnosti
background-position
- Zobrazeno: 1256
Definice a použití
Vlastnost background-position nastaví pozici obrázku na pozadí.
CSS Syntaxe
background-position: hodnota
| Hodnoty | Popis |
|---|---|
| left top left center left bottom right top right center right bottom center top center center center bottom | pokud zadáte pouze jednu hodnotu, bude druhá hodnota "center" |
| x% y% | první hodnota je horizontální poloha, druhá hodnota je vertikální poloha, v levém horním rohu je 0% 0%, pravém dolním rohu je ze 100% na 100%, pokud zadáte pouze jednu hodnotu, bude druhá hodnota 50%, výchozí hodnota je 0% 0% |
| xpos ypos | první hodnota je horizontální poloha, druhá hodnota je vertikální poloha, v levém horním rohu je 0 0, jednotky mohou být pixelů (0px 0px) nebo jakékoliv jiné CSS jednotky, pokud zadáte pouze jednu hodnotu, bude druhá hodnota 50%, můžete kombinovat % a pozice |
| initial | nastaví tuto vlastnost zpět na její výchozí hodnotu |
| inherit | zdědí tuto vlastnost od jeho rodičovského elementu |
Ukázka použití
Umístění obrázku na pozadí (background-image) na střed.
CSS:
body {
background-image: url('cesta-obrazku.jpg');
background-repeat: no-repeat;
background-attachment: fixed;
background-position: center;
}Jak umístit obrázek na pozadí pomocí procent:
body {
background-image: url('cesta-obrazku.jpg);
background-repeat: no-repeat;
background-attachment: fixed;
background-position: 40% 30%;
}Jak umístit obrázek na pozadí pomocí pixelů (obrazových bodů):
body {
background-image: url('cesta-obrazku.jpg');
background-repeat: no-repeat;
background-attachment: fixed;
background-position: 60px 120px;
}
Připojení na Twitter
