style = 'position：absolute'とstyle = 'position：relative'の違い
Difference Between Style Position
解決：
絶対配置とは、要素がページレイアウトの通常のフローから完全に外れることを意味します。ページ上の残りの要素に関する限り、絶対的に配置された要素は単に存在しません。次に、要素自体が個別に描画され、他のすべての上に、を使用して指定した位置に「上に」配置されます。左、右、上、下の属性。
これらの属性で指定した位置を使用して、要素は、それ以外の位置属性を持つ最後の祖先要素内のその位置に配置されます。static（position属性が指定されていない場合、ページ要素はデフォルトでstaticになります）、またはそのような祖先が存在しない場合はドキュメント本文（ブラウザービューポート）。
たとえば、私がこのコードを持っていた場合：
...NSブラウザのビューポートの上部から20ピクセル、左端から20ピクセルの位置に配置されます。
しかし、私がこのようなことをした場合：
...そうして内部divは、上部から20pxに配置されます。外側のdiv、および同じの左端から20px、外側のdivはで配置されていませんposition：staticを使用するように明示的に設定したため、位置：相対。
一方、相対的なポジショニングは、ポジショニングがまったくないことを示すのと同じですが、左、右、上、下の属性は、要素を通常のレイアウトから「微調整」します。ただし、ページ上の残りの要素は、要素が通常の場所にあるかのようにレイアウトされます。
たとえば、私がこのコードを持っていた場合：
Span1 Span2 Span3 ...次に3つすべて要素は重なり合うことなく隣り合って配置されます。
2番目を設定した場合次のように、相対ポジショニングを使用するには：
Span1 Span2 Span3 ...次に、Span2はSpan1の右側に5pxオーバーラップします。 Span1とSpan3は、最初の例とまったく同じ場所に配置され、Span2の右側とSpan3の左側の間に5pxのギャップが残ります。
それが物事を少し明確にすることを願っています。
相対的な位置付け： 要素は、ビューポートの座標軸からオフセットされた位置に、独自の座標軸を作成します。これはドキュメントフローの一部ですが、シフトされています。
絶対ポジショニング： 要素は、その親要素の中で最も近い使用可能な座標軸を検索します。次に、この座標軸からのオフセットを指定して、要素を配置します。ドキュメントの通常のフローから削除されます。
ソース
あなたは間違いなく「AListApart」からこのポジショニング記事をチェックしたいと思うでしょう。 CSSの位置付けをわかりやすく説明するのに役立ちました（この記事の前は、私には非常識に思えました）。
