Comment centrer une image horizontalement et verticalement dans une division à l'aide de CSS ?

Alignement d'une image centrée et alignée verticalement dans une division

Pour l'extrait HTML donné :

`

`

L'ajustement du placement de l'image pour qu'elle soit centrée horizontalement et verticalement dans le div désigné peut être réalisé à l'aide des propriétés CSS.

Pour aligner horizontalement l'image au centre, utilisez :

#over img {
  margin-left: auto;
  margin-right: auto;
}

Cela aligne l'image à gauche et les bords droits du div, ce qui entraîne un placement centré.

Pour aligner verticalement l'image au milieu, définissez l'image pour qu'elle soit un élément de niveau bloc en utilisant :

#over img {
  display: block;
}

Ceci permet à l'image de prendre toute la hauteur de l'espace disponible au sein du div.

Les extraits HTML et CSS mis à jour devenir :

<div>

body {
  margin: 0;
}

#over img {
  margin-left: auto;
  margin-right: auto;
  display: block;
}

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!