2 つの連続する div。1 つは絶対位置にあり、もう 1 つは相対位置にあります。それらは互いに影響を及ぼしますか？ _html/css_WEB-ITnose

最初の div の位置

2 番目の div の位置

および

最初最初の div の位置

2 番目の div の位置
< ; /div>

最初の div と 2 番目の div は異なるレベルにあるべきだと理解しています。

この 2 つは影響を与えません

は影響を与えません。 。それらの位置は親 div に対して相対的です
これら 2 つは何の効果もありません

HTML で試してみると、上の 2 番目の div が異なる margin: 14 10 0 19; margin の下の 2 番目の div が異なることがわかります。 ; このようにすると、表示効果が異なります

影響しません。 。それらの位置は親 div に対して相対的です

上記と同じ

2 番目の div margin:14 10 0 0;

2 番目の div の左マージンのみが変更され、2 番目の div の位置にのみ影響します

引用1 階の回答から:

これら 2 つは何の効果もありません

HTML で試してみると、マージンの上の 2 番目の div: 14 10 0 19; このように、表示効果が異なります。なぜですか

左マージンが異なるので、当然表示効果も異なります。

Position:absolute を定義します

その後、div はドキュメント (DOCUMENT) のデフォルトのシーケンス フローから外れます

最初の絶対 div は、ドキュメント フロー内の独自のスペースを削除する場合にのみ元のスペースに影響します。このときのルールは、div がドキュメント フローから消えて表示されないようなものです。ドキュメント フローから離脱した後の上と左の位置は、他の要素の位置には影響せず、z-index を使用して、z 軸の表示優先度を調整できます。
2 番目の相対 div は、最初にドキュメント フロー内の通常の位置のスペースを占有し、このスペースをドキュメント フロー内に保持した後、左上などに従って元の位置に対して位置をオフセットします (元のスペースはそうではありません)。 offset )、現時点では他の要素の配置には影響せず、他の要素をカバーすることもできます。
要約すると。絶対 div を定義する場合、2 番目の div は上に移動してスペースを占め (最初の div がスペースを削除したため)、その後の 2 つの div の位置は相互に影響しません。

8階の詳しい説明

IEの問題であることが分かりました Firefoxとie7では問題ありませんが、IE9では問題があります

ie9では、2つのdivが異なります。 3 階の返信から:

1 階の返信からの引用:

これら 2 つは何の効果もありません

HTML で試してみると、マージンの上の 2 番目の div:14 10 0 19; がわかります。 margin:14 10 0 0; と表示されます 効果が違います

左のマージンが違うので当然表示効果も違います。

声明：

この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。