Comment centrer la boîte div en HTML

Il existe six façons de centrer une boîte div en HTML : attributs d'alignement du texte, Flexbox, Grid, margin : auto, positionnement absolu et attributs flex-container. Le choix de la méthode spécifique dépend des exigences de taille, d’emplacement et d’agencement de la boîte.

HTML Comment centrer une boîte div

En HTML, vous pouvez centrer une boîte div par les méthodes suivantes :

1. Utilisez l'attribut d'alignement du texte

<code class="html"><div style="text-align: center;">
  内容
</div></code>

2.

<code class="html"><div style="display: flex; justify-content: center; align-items: center;">
  内容
</div></code>

3. Utilisez Grid

<code class="html"><div style="display: grid; place-items: center;">
  内容
</div></code>

4. Utilisez la marge : auto

<code class="html"><div style="margin: auto;">
  内容
</div></code>

5. Utilisez le positionnement absolu

<code class="html"><div style="position: absolute; left: 50%; transform: translate(-50%, -50%);">
  内容
</div></code>

6. Quelle méthode choisir dépend de la taille de la boîte, de l’emplacement et des exigences de disposition.

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!