HTML で div ボックスを中央に配置するには、テキスト配置属性、フレックスボックス、グリッド、マージン: 自動、絶対配置、およびフレックスコンテナ属性の 6 つの方法があります。どの方法を選択するかは、ボックスのサイズ、位置、レイアウトの要件によって異なります。
HTML div ボックスを中央に配置する方法
HTML では、次の方法で div ボックスを中央に配置できます。 :
1. テキスト配置プロパティを使用します
<code class="html"><div style="text-align: center;"> 内容 </div></code>
2. Flexbox を使用します
<code class="html"><div style="display: flex; justify-content: center; align-items: center;"> 内容 </div></code>
3. グリッドを使用します
<code class="html"><div style="display: grid; place-items: center;"> 内容 </div></code>
4. マージンを使用します: auto
<code class="html"><div style="margin: auto;"> 内容 </div></code>
5. 絶対位置を使用します#
<code class="html"><div style="position: absolute; left: 50%; transform: translate(-50%, -50%);"> 内容 </div></code>
6. フレックスコンテナのプロパティを使用する
<code class="html"><div style="flex-container: center;"> 内容 </div></code>
以上がHTMLでdivボックスを中央に配置する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
