Styl atrybutu backgroundPosition

Definicja i użycie

backgroundPosition Ustawienie lub zwracanie pozycji obrazu tła w elemencie.

Zobacz również:

HTML Styl:Atrybut background

CSS Kurs:Tło CSS

CSS3 Kurs:CSS3 Tło

CSS ReferencjaAtrybut background-image

CSS ReferencjaAtrybut background-position

Przykład

Przykład 1

Zmień pozycję obrazu tła:

document.body.style.backgroundPosition = "top right";

spróbuj sam

Przykład 2

Zmień pozycję obrazu tła w elemencie <div> na dolny środek:

document.getElementById("myDiv").style.backgroundPosition = "center bottom";

spróbuj sam

przykład 3

zmień pozycję obrazu tła w elemencie <div> na poziom 200 pikseli i pion 40 pikseli:

document.getElementById("myDiv").style.backgroundPosition = "200px 40px";

spróbuj sam

przykład 4

zwrócenie pozycji obrazu tła w elemencie <div>:

document.getElementById("myDiv").style.backgroundPosition; 

spróbuj sam

gramatyka

zwrócenie atrybutu backgroundPosition:

obiekt.style.backgroundPosition

ustawienie atrybutu backgroundPosition:

obiekt.style.backgroundPosition = value

wartość atrybutu

wartość opis
  • górny lewy
  • górny środek
  • górny prawy
  • środek lewy
  • środek środek
  • środek prawy
  • dolny lewy
  • dolny środek
  • dolny prawy
jeśli określisz tylko jedną nazwę kluczową, druga wartość będzie "center".
x% y%

wartość x oznacza pozycję poziomą, wartość y oznacza pozycję pionową.

lewy górny róg to 0%. Dolny prawy róg to 100% 100%.

jeśli określisz tylko jedną wartość, druga wyniesie 50%.

xpos ypos

wartość x oznacza pozycję poziomą, wartość y oznacza pozycję pionową.

lewy górny róg to 0 0. Jednostką może być piksel (0px 0px) lub jakakolwiek inna jednostka CSS.

jeśli określisz tylko jedną wartość, druga wyniesie 50%. Możesz mieszać % i jednostki.

initial ustaw tę właściwość na jej wartość domyślną. Zobacz initial.
inherit dziedziczy tę właściwość od elementu nadrzędnego. Zobacz inherit.

szczegóły techniczne

wartość domyślna: 0% 0%
wartość zwracana: ciąg znaków, który oznacza pozycję obrazu tła.
wersja CSS: CSS1

obsługa przeglądarek

backgroundPosition jest cechą CSS1 (1996).

wszystkie przeglądarki obsługują je w pełni:

Chrome Edge Firefox Safari Opera IE
Chrome Edge Firefox Safari Opera IE
obsługiwane obsługiwane obsługiwane obsługiwane obsługiwane obsługiwane