9

Aクラスでは、2 つの div がある場合を学習しました:として定義されているラッパー div (それを div と呼びましょう)position: relative;と、別の div、divB内にある div Awith position: absolute;.

何が起こるかというと、 div のB位置が div の位置に依存するようになりましたA。つまり、 divBのポイント 0,0 はブラウザのポイント 0,0 ではなく、 div のポイントAです。したがって、divAを右に 20 ピクセル移動し、div をB右に 30 ピクセル移動すると、divBはブラウザのポイント 0,0 の右に 50 ピクセルになります。

さて、私の質問は次のとおりです。3 つの div がある場合はどうなりますか。position: relative;のdiv A 、その中に のBdiv position: absolute、および div 内Bに別の div (div C) とposition: absolute;. では、div C はどのように動作するでしょうか。その位置 0,0 は divAまたは divの位置になりBますか?

前もって感謝します。

コード:

<style type = "text/css">
#a {
position: relative;
left: 20px;
}

#b {
position:absolute;
left: 20px
}

#c {
left: 20px
position:absolute;
}
</style>
<div id = "a">
    <div id = "b">
        <div id = "c">
        test
        </div>
    </div>
</div>
4

4 に答える 4

16

このJSFiddleからわかるように、「C」div の位置は、親の「B」に対して相対的です。

position: absolute;
于 2013-09-21T12:17:27.863 に答える
6

Div B - 絶対配置の要素は、最も近い配置 (絶対、相対、または固定) の parentに従って配置されます。

于 2013-09-21T12:11:45.690 に答える