Maison >interface Web >tutoriel CSS >Comment centrer horizontalement une image à l'intérieur d'un Div ?

Comment centrer horizontalement une image à l'intérieur d'un Div ?

Susan Sarandon
Susan Sarandonoriginal
2024-12-22 15:59:15553parcourir

How to Horizontally Center an Image Inside a Div?

Alignement d'une image horizontalement dans un conteneur Div

Question :

Comment obtenir une image horizontale alignement pour une image qui réside dans un conteneur div élément ?

Détails :

Le code HTML et CSS fourni inclut la structure nécessaire pour le conteneur et les éléments de l'image, mais l'image reste non centrée.

Solution :

Pour centrer efficacement l'image horizontalement, appliquez la règle CSS suivante au image :

#artiststhumbnail a img {
    display:block;
    margin:auto;
}

Cet ajustement garantit que l'image est définie pour s'afficher en tant qu'élément de bloc, permettant l'application de marge. Par la suite, le paramètre de marge automatique demande au navigateur de calculer et d'appliquer automatiquement des marges gauche et droite égales, centrant ainsi l'image.

Confirmation visuelle :

Pour démontrer cette solution , visitez : http://jsfiddle.net/marvo/3k3CC/2/

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!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Article précédent:Opacité vs CSS FilterArticle suivant:Opacité vs CSS Filter