1

親要素の境界内に子 html 要素を強制的に配置する方法。絶対に配置された子要素でさえ、親要素の境界内に留まる (またはクリップされる)。

これを行っているのは、子コンテンツの作成者が絶対配置要素で「ページ コンテンツをオーバーライド」するのを防ぎたいからです。

iframe を使用したくありません。私の最善の解決策は、javascript を使用して、スタイル位置が「絶対」または「固定」に設定されたすべての子要素を検索し、それらを「静的」に変換することですが、JavaScript 以外のアプローチを使用することをお勧めします。どんな助けも良い助けです。

注意: style="position:relative;" の設定 親要素に対しては、 style="position:absolute;"を持つ子要素に対してのみ解決します であり、style="position:fixed;"ではありません

4

1 に答える 1

4

親要素に position: relative セットがある場合、position: absolute を持つ内部のすべての子は、親要素の境界内に配置されます。

それで：

<div style="position:relative; width:400px; height:400px;">
    <div style="position:absolute; left:190px; top:190px; width:20px; height:20px;">
</div>

400px の正方形の境界内に絶対に配置された 20px の正方形が得られます。

クリップしたい場合は、overflow: hidden を使用する必要があり、場合によっては z インデックスで遊ぶ必要があります。クリップする div には、z-index: -1 が必要な場合があります。

于 2012-02-01T19:19:39.137 に答える