61

兄弟に対してdivを絶対的に配置する方法はありますか?例:div内には、他に2つのdiv(div1とdiv2)があります。div1に対してdiv2を絶対に配置したいと思います。

4

5 に答える 5

48

絶対測位は「現在の測位コンテキスト」に依存します。これには、親要素(絶対または相対配置の場合)が含まれる場合がありますが、兄弟要素が含まれることはありません。

兄弟ではなく親子になるように、domを再編成できますか?その場合、親の位置を相対または絶対に設定し、子の位置を絶対に設定すると、子の位置は親に対して絶対のままになります。

于 2012-05-16T19:06:08.877 に答える
21

w3c の仕様によると、絶対位置を使用する方法はありません。

絶対測位モデルでは、ボックスはそれを含むブロックに対して明示的にオフセットされます

—兄弟ブロックではなく、親ブロックに対して

また、 w3c 仕様によると、相対ポジショニングを使用する方法はありません。

ボックスが通常の流れに従って配置されるか、フロートされると、この位置に対してシフトされる場合があります。

—兄弟ブロックではなく、ブロックの位置に対して

まとめ:

あなたが説明した問題は誰も解決できません

于 2012-05-16T19:06:57.900 に答える
11

正解は次のとおりです。いいえ。ただし、少なくともその垂直位置は兄弟の影響を受ける可能性があります。

他の回答が述べているように、絶対的に配置されたdivの位置は、その祖先を基準にしています。正確に言うと、DOMツリーをトラバースするときに、静的に配置されていない最初の祖先を基準にしています。

ただし、絶対に配置された要素は、その兄弟(要素の前にあるもの)の影響も受けます。これらの先行する兄弟が比較的配置されていて、絶対的に配置された要素の上部プロパティが設定されていない場合、それらの比較的配置された兄弟の下に垂直に配置されます。

<div class="relativeContainer">
  <div class="relative block">relative 1</div>
  <div class="relative block">relative 2</div>
  <div class="absoluteTopZero block">absolute top 0</div>
  <div class="absoluteTopInherited block">absolute</div> 
</div>

ここに画像の説明を入力してください

このフィドルを参照してください: https ://jsfiddle.net/fgxeu54t/28/

于 2020-07-12T08:31:00.620 に答える
2

必要に応じて、それらをフロートさせるか、適切な左/上/右/下の値で両方を絶対位置に配置できます。

マークアップを投稿して、達成しようとしていることを正確に説明してください。

于 2012-05-16T19:03:07.787 に答える
2

jqueryで試してみてください

<script type="text/javascript">
        $('#div2').css('margin-left', $('#div1').outerWidth() +XXX + 'px');
于 2012-05-16T19:10:22.300 に答える