CSS - posición de fondo

Descripción

Establece la posición inicial de la imagen de fondo del elemento, si se especifica; los valores normalmente se emparejan para proporcionar posiciones x, y; la posición predeterminada es 0% 0%.

Valores posibles

percent
none
length
top
center
bottom
left
right

Se aplica a

elementos reemplazados y a nivel de bloque

Sintaxis DOM

object.style.backgroundPosition = "10 30";

Ejemplo

A continuación se muestra el ejemplo que demuestra cómo establecer la posición de la imagen de fondo a 100 píxeles del lado izquierdo.

<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 continuación se muestra el ejemplo que demuestra cómo establecer la posición de la imagen de fondo a 100 píxeles del lado izquierdo y 200 píxeles hacia abajo desde la 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>

Producirá el siguiente resultado:

↰ Previous page