Maison  >  Article  >  interface Web  >  Comment centrer l'image dans bootstrap

Comment centrer l'image dans bootstrap

尚
original
2019-07-18 17:47:094225parcourir

Comment centrer l'image dans bootstrap

Si vous utilisez Bootstrap 3, vous pouvez rencontrer un tel problème. Vous pouvez utiliser .text-center pour centrer le texte, mais l'image ne peut pas être centrée pour résoudre ce problème. Le problème est que vous devrez peut-être faire beaucoup de choses, comme ajouter un div en dehors de l'image, puis ajuster la largeur, la hauteur de l'image, etc.

Il existe une méthode très simple dans Bootstrap 3 pour obtenir un alignement central horizontal et vertical réactif des images. Ajoutez simplement le bloc central img-responsive de la classe CSS à l'image pour y parvenir. Jetez un oeil Jetez un oeil.

Pour aligner les images dans Bootstrap 3, vous pouvez essayer le code suivant :

Introduction à Bootstrap v3.0.1. En utilisant la classe center-block, vous pouvez aligner la figure au centre du conteneur. Voici un exemple :

<img src="图片地址" class="img-responsive center-block" />

Pour des articles plus techniques liés à Bootstrap, veuillez visiter la colonne

Tutoriel Bootstrap pour apprendre !

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