Comment centrer le contenu dans Twitter Bootstrap ?

Comment centrer le contenu à l'aide de Twitter Bootstrap

Dans Twitter Bootstrap, vous pouvez obtenir un contenu centré grâce à des méthodes qui varient en fonction de vos besoins spécifiques.

Centrage du texte

Pour aligner le texte au centre, vous pouvez appliquer .text-center au conteneur parent. Cette classe, introduite dans Bootstrap 2.3.0, permet un centrage du texte sans effort.

<div class="text-center">
  <h1>Bootstrap Starter Template</h1>
  <p>Example text.</p>
</div>

Remarques :

• Pour les options d'alignement du texte dans les anciennes versions de Bootstrap (pré-2.3.0), vous pouvez ajouter text-align: center au .row ou .span12 conteneur.

Méthodes alternatives pour le contenu non textuel

Pour centrer des éléments non textuels (par exemple, des images ou des boutons), vous disposez des options suivantes :

• Marge : Ajouter margin : 0 auto à l'élément, ce qui crée des marges égales des deux côtés.
• Float : Définissez float: none, puis ajoutez margin: 0 auto au conteneur parent.
• Classes utilitaires Bootstrap : Utilisez les classes .pull-left, .pull-right et .center-block.
• Personnalisé Styles : Définissez les règles de centrage dans votre propre feuille de style personnalisée.

Choisissez la méthode qui convient le mieux à vos besoins spécifiques et à votre version de Bootstrap.

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!