Cómo implementar imágenes CSS llenas de divs

La primera estructura: la imagen es un elemento secundario.

 <div>
        <img src="Introducir dirección de imagen" alt="" class="Img">
</div>

Método 1: agregar object-fit:cover al elemento img

 div{
ancho: 500 px;
altura: 500 px;
}
.Img{
    ancho: 100%;
    altura: 100%;
    ajuste de objeto: cubierta;
}

Método 2: centrar el elemento img verticalmente y establecer el ancho y alto mínimos en pantalla completa

 div{
	ancho: 500 px;
	altura: 500 px;
	posición: relativa;
	desbordamiento: oculto;
	}
.Img{
	posición: absoluta;
	arriba: 50%;
	izquierda: 50%;
	mostrar: bloquear;
	ancho mínimo: 100%;
	altura mínima: 100%;
	transformar: traducir (-50%, -50%);
}

La segunda estructura: la imagen es una imagen de fondo.

 <div class="contenedor"></div>

Método: agregue tamaño de fondo: portada al elemento div; configure la imagen para que no se repita, no se repita;

 .recipiente{
				altura: 500 px;
				ancho: 500 px;
				margen: 0px automático;
				fondo: url('../Status/img/health.png') sin repetición;
				tamaño de fondo: portada;
			}

Con esto concluye este artículo sobre cómo llenar un div con imágenes CSS. Para obtener más contenido sobre cómo llenar un div con imágenes CSS, busque los artículos anteriores en downcodes.com o continúe navegando por los artículos relacionados a continuación. códigos de bajada en el futuro .com!