CSS で要素を中央に配置する方法: 絶対位置と相対位置?

CSS を使用した要素の中央揃え: 絶対位置と相対位置

CSS を使用して要素を水平方向に中央揃えにしようとすると、技術的な問題が発生する可能性があります。 「position:Absolute」スタイルと「margin:auto」スタイルの両方を適用します。これは、絶対配置の動作方法によるものです。

絶対配置では、要素の位置は最も外側のコンテナの境界に基づきます。自動設定されたマージンを含むマージンは、要素の位置を基準にして計算されます。したがって、絶対位置の要素に「margin: auto」を指定しても、要素は自動的に中央に配置されません。マージンは要素の絶対位置を基準にして計算され、すでに設定されているためです。

中央揃えの問題を解決するには、次のように切り替えることができます。 「position:relative」に変更します。これは、要素の位置をドキュメント フロー内の元の位置を基準にします。相対的に配置された要素に適用されるマージンは、要素の調整された位置に基づいて計算され、「margin: auto」で要素を効果的に中央に配置できるようになります。

以上がCSS で要素を中央に配置する方法: 絶対位置と相対位置?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。