HTML/CSS の位​​置決めにおける「position:Absolute」と「position:fixed」はどのように異なりますか?

親またはウィンドウを基準にして要素を固定配置する

HTML と CSS では、要素を配置する主な方法が 2 つあります。親を基準にして配置します。またはウィンドウを基準にします。

要素を相対的に固定Parent

要素を親要素に対して相対的に固定して配置するには、次の CSS プロパティを使用します。

position: absolute;

要素が絶対的に配置される場合、その位置は親要素に対して相対的に決定されます。親要素をすぐに含みます。例:

#parent {
  position: relative;
}
#child {
  position: absolute;
  left: 50px;
  top: 20px;
}

この例では、子要素は親要素の左から 50 ピクセル、上から 20 ピクセルの位置に配置されます。

位置要素固定Relative to Window

ウィンドウを基準にして要素を固定して配置するには、次の CSS を使用します。 property:

position: fixed;

要素が固定配置されている場合、その位置はビューポートを基準にして決定されます。例:

#my-element {
  position: fixed;
  right: 0;
  top: 120px;
}

この例では、my-要素はビューポートの上から 120 ピクセル、右から 0 ピクセルの位置に配置されます。

以上がHTML/CSS の位​​置決めにおける「position:Absolute」と「position:fixed」はどのように異なりますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。