domingo, 14 de febrero de 2021

👨‍💻 Cómo poner imagen de fondo (Background) a un div

Fuente.

https://como.help/programacion/css/como-poner-imagen-de-fondo-background-a-un-div


Para agregar una imagen de fondo a un elemento con CSS existen multiples caminos, aquí veremos un ejemplo de uno de ellos.

div#myDiv{
          width:200px;
          height:200px;
          background-image: url('https://placekitten.com/200/300');
          background-repeat:no-repeat;
          background-size:cover;
          background-position:center center;
        }
<div id="myDiv"></div>

En este ejemplo podemos ver que asignamos el fondo de la imagen para que ocupe el 100% del espacio con la propiedad background-size:cover; y la centramos en la mitad con la propiedad background-position:center center;