CSS - posição de fundo

Descrição

Define a posição inicial da imagem de fundo do elemento, se especificada; os valores normalmente são emparelhados para fornecer as posições x, y; a posição padrão é 0% 0%.

Valores possíveis

percent
none
length
top
center
bottom
left
right

Aplica-se a

nível de bloco e elementos substituídos

Sintaxe DOM

object.style.backgroundPosition = "10 30";

Exemplo

A seguir está o exemplo que demonstra como definir a posição da imagem de fundo 100 pixels de distância do lado esquerdo.

<table style = "background-image:url(/images/pattern1.gif); background-position:100px;">
   <tr>
      <td>
         Background image positioned 100 pixels away from the left.
      </td>
   </tr>
</table>

A seguir está o exemplo que demonstra como definir a posição da imagem de fundo 100 pixels de distância do lado esquerdo e 200 pixels para baixo da parte superior.

<html>
   <head>
   </head>

   <body>
      <p style = "background-image:url(/css/images/logo.png); background-position:100px 200px;">
         The background image positioned 100 pixels away from the 
         left and 200  pixels from the top.up
      </p>
   </body>
</html>

Isso produzirá o seguinte resultado -

↰ Previous page