Quiero agregar un margen a la imagen de fondo para que la distancia desde el medio de la pantalla, pero agregarla dentro de esa clase agrega un margen a todo el cuerpo.¿Cómo agrego el margen a solo la imagen de fondo?
body.poppage {
background: url(/Imagenes/tip3.png) 50% 200px no-repeat #E2E4E9;
}
¿Cómo podría hacerlo? Gracias
se puede utilizar la propiedad
background-position Es posible que desee probar otra cosa ... como mover la imagen a la siguiente hijo. Puedes hacer un div envoltorio alrededor de tu div de ancho fijo para lograr esta tarea.
Realmente no se pueden agregar márgenes a una imagen de fondo, ya que en realidad no es un elemento. Un par de cosas que usted puede intentar:
Si usted tiene un solo elemento que contiene el interior del cuerpo, se puede aplicar la imagen de fondo a este elemento y establecer márgenes en él.
Si todo lo que desea es hacer que la imagen de fondo parezca estar flotando dentro de su contenedor, establezca su posición de fondo.
Utilice el relleno de contenedores para hacer una especie de margen para el fondo.
<div class="thebox">
<p>HEY!</p>
</div>
div.thebox
{
box-sizing: border-box;
width:400px;
height:400px;
border: 2px solid #000000;
padding: 10px;
background: url(http://studio-creator.com/blog/public/html5.jpg) center;
background-size: contain;
background-repeat: no-repeat;
background-origin: content-box;
}
¡Muy buen ejemplo de uso de origen de fondo! Puede valer la pena agregar una explicación sobre por qué está ahí (para posicionarse en relación con el contenido, en lugar de los bordes de relleno como sería el valor predeterminado) – leo
pero la posición de fondo cuenta los píxeles necesariamente de la izquierda o hacia la derecha de la derecha de la pantalla? No hay forma de comenzar a contar desde el medio? – lisovaccaro
Crea un contenedor con este fondo y céntralo en la página – fiiv