text-align: center を使用して、HTML で div を水平方向に中央揃えにします。垂直方向の中央揃えの手順は次のとおりです。 div の高さと垂直線の高さを設定します。コンテンツを垂直方向の中央に配置するには、margin: 0 auto を使用します。フレックスボックスまたはグリッド レイアウトを使用して中央揃えを行うこともできます。
Centered divのCSSコード
Centered div
HTMLでは、divはデフォルトでページの左側に水平に配置されるブロックレベルの要素です。中央揃えは CSS プロパティを使用して実現できます。
水平方向の中央揃え
text-align
属性を使用して、div のコンテンツを水平方向に中央揃えにします。 text-align
属性可以水平居中div的内容。
<code class="css">div { text-align: center; }</code>
垂直居中
垂直居中div的内容比较复杂,需要使用以下步骤:
margin
<code class="css">div { height: 200px; /* 设置div的高度 */ line-height: 200px; /* 设置垂直线的高度 */ margin: 0 auto; /* 将内容垂直居中 */ }</code>
垂直中央揃えの div の内容はより複雑で、次の手順が必要です:
margin
属性を使用して、コンテンツを垂直方向の中央に配置します。
<code class="css">div { display: flex; justify-content: center; align-items: center; }</code>
<code class="css">div { display: grid; place-items: center; }</code>
以上がdivセンタリング用のCSSコードの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。