DIV 内のテキストを垂直方向の中央に配置するにはどうすればよいですか?

DIV 内の垂直方向のテキスト配置

DIV 内のテキストを垂直方向に中央揃えにしようとしているときに、提供されたコードが障害に遭遇しました。 margin-top 属性を利用しているにもかかわらず、望ましい位置合わせは依然として困難です。これに対処するには、洗練されたアプローチが必要です。

解決策:

垂直方向の配置を実現する鍵は、DIV の CSS スタイルを変更することにあります。コンテンツの特定の要件と複雑さに応じて、テクニックを組み合わせて使用​​できます。

• 単一行のテキストの場合:

DIV の "line-height" プロパティをその高さと同じに設定します。これはブラウザにテキストの上下に均等なスペースを割り当て、テキストを効果的に垂直方向の中央に配置するように指示します。

例:

div {
  height: 200px;
  line-height: 200px;
}

<div>Vertically Centered Text</div>

以上がDIV 内のテキストを垂直方向の中央に配置するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。