CSS相対位置

免責事項:この記事はブロガーオリジナル記事です、続くBY-SAのCC 4.0を著作権契約、複製、元のソースのリンクと、この文を添付してください。
このリンク: https://blog.csdn.net/mynewdays/article/details/91411912

CSSで、デフォルトモードの位置決め要素として静的、すなわち、

position:static

既定のドキュメントの流れに配置された要素

なお、このとき:

  • など、右、左のセットは、プロパティ要素は効果がありませんオフセット
  • 要素のZインデックスは影響がない提供しました

要素の相対的な位置を設定した後、すべての変更を持っていない要素がオフセットなどを設定するために残されなければならない有効となります

  • 相対的な位置決めは、素子自体の元の位置に対してオフセット配置されています。
  • オフセットを設定した後ときに相対位置決め要素、要素の元の位置が保持されます
  • 素子の両側の要素の相対的な位置決めは、移動体とともに移動しない場合
  • 相対位置決め要素はデフォルト他の要素を上書きする場合、z屈折率要素に配置されてもよい。上書きが許可-1
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<style>
		div{
			width: 200px;
			height: 170px;
			border: 1px solid black;
		}
		.box1{
			background-color: red;
			
			position: relative;
			left: 10px;
			top: 20px;
		}
		.box2{
			background-color: green;
		}

	</style>
</head>
<body>
	<div class="box1"></div>
	<div class="box2"></div>
</body>
</html>

 

おすすめ

転載: blog.csdn.net/mynewdays/article/details/91411912