14

廃止されたダストからCSSスキルを更新するための長い旅の中で、特定のCSSプロパティ(特にz-index)をいじってみました。何か奇妙なことに気付いているか、特定の条件があるかもしれません。

例: http: //jsfiddle.net/mEpgR/

要素div1の親はcontです。div1のpositionプロパティをabsoluteに設定しましたが、それをシフトすると、親に対して移動します。絶対位置に設定されたアイテムは、通常のフローの外部にあり、親としてのブラウザーポートに対してのみ移動するという印象を受けました。

私は何が欠けていますか?

フィドルリンクが機能しない場合は、次のようにコーディングします。

CSS:

.cont {
position:relative; 
height:200px;
top:200px; 
left:100px; 
background: green; width: 200px; 
}

.div1 {
background:red; 
position:absolute; 
top:50px;
}

HTML:

<div class="cont">
<div class="div1">DIV1</div>
</div>
4

1 に答える 1

46

絶対位置の要素は、静的以外の位置を持つ最初の親要素を基準にして配置されます。あなたはそれを親の中に持っているので、relativeそれはこの親に対して絶対的に配置されます。

fixedブラウザウィンドウを基準にした位置を探している可能性があります。

于 2013-01-17T17:11:57.550 に答える