Exemplo
Alterar a posição de um background-image:
document.body.style.backgroundPosition = "top right";
Tente você mesmo " Mais "Try it Yourself" exemplos abaixo.
Definição e Uso
Os conjuntos de propriedades backgroundPosition ou retorna a posição de uma imagem de fundo dentro de um elemento.
Suporte navegador
Os números na tabela especificar a primeira versão do navegador que suporta totalmente a propriedade.
Propriedade | |||||
---|---|---|---|---|---|
backgroundPosition | 1.0 | 4.0 | 1.0 | 1.0 | 3,5 |
Sintaxe
Devolver o imóvel backgroundPosition:
object .style.backgroundPosition
Defina a propriedade backgroundPosition:
object .style.backgroundPosition= value
Valores de propriedade
Valor | Descrição |
---|---|
top left top center top right center left center center center right bottom left bottom center bottom right | Se você especificar apenas uma palavra-chave, o outro valor será "center" . |
x% y% | O valor de x indica a posição horizontal e o valor y indica a posição vertical. O canto superior esquerdo é 0% 0%. O canto inferior direito é de 100% a 100%. Se você especificar apenas um valor, o outro valor será de 50%. |
xpos ypos | O valor de x indica a posição horizontal e o valor y indica a posição vertical. O canto superior esquerdo é 0 0. As unidades podem ser pixels (0px 0px) ou quaisquer outras unidades CSS. Se você especificar apenas um valor, o outro valor será de 50%. Você pode misturar% e unidades |
initial | Define essa propriedade para seu valor padrão. Leia sobre inicial |
inherit | Herda esta propriedade a partir de seu elemento pai. Leia sobre herdar |
Detalhes técnicos
Valor padrão: | 0% 0% |
---|---|
Valor de retorno: | A String, que representa a posição de um background-image |
CSS Versão | CSS1 |
mais Exemplos
Exemplo
Alterar a posição da imagem de fundo em um <div> elemento para baixo centro:
document.getElementById("myDiv").style.backgroundPosition = "center bottom";
Tente você mesmo " Exemplo
Alterar a posição da imagem de fundo em um <div> elemento para 200px horizontal e vertical, 40px:
document.getElementById("myDiv").style.backgroundPosition = "200px 40px";
Tente você mesmo " Exemplo
Retornar a posição da imagem de fundo em um <div> elemento:
document.getElementById("myDiv").style.backgroundPosition;
Tente você mesmo " Páginas relacionadas
CSS tutorial: Background CSS
Referência CSS: background-image property
Referência CSS: background-position property
Referência HTML DOM: background property
<Estilo de objeto