<div>
<img src="Introduire l'adresse de l'image" alt="" class="Img">
</div>Méthode 1 : ajouter object-fit:cover à l'élément img
div{
largeur : 500 px ;
hauteur : 500 px ;
}
.Img{
largeur : 100 % ;
hauteur : 100 % ;
ajustement de l'objet : couverture ;
}Méthode 2 : centrez l'élément img verticalement et définissez la largeur et la hauteur minimales en plein écran
div{
largeur : 500 px ;
hauteur : 500 px ;
position : relative ;
débordement : caché ;
}
.Img{
position : absolue ;
haut : 50 % ;
gauche : 50 % ;
affichage : bloc ;
largeur minimale : 100 % ;
hauteur min : 100 % ;
transformer: traduire (-50%, -50%);
}<div class="conteneur"></div>
Méthode : ajoutez background-size : cover à l'élément div ; définissez l'image sur non-repeat no-repeat.
.récipient{
hauteur : 500 px ;
largeur : 500 px ;
marge : 0px automatique ;
arrière-plan : url('../Status/img/health.png') no-repeat ;
taille de l'arrière-plan : couverture ;
}Ceci conclut cet article sur la façon de remplir un div avec des images CSS. Pour plus d'informations sur la façon de remplir un div avec des images CSS, veuillez rechercher les articles précédents sur downcodes.com ou continuer à parcourir les articles connexes ci-dessous. downcodes à l'avenir.