©TCP-tryWWW

<!DOCTYPE html>
<html lang="ko">

<head>
	<meta charset="UTF-8">
	<title>CSS Position</title>
	<style>
		div.static {
			border: 2px solid #B8860B;
			position: static;
		}
		div.relative {
			border: 2px solid #CD5C5C;
			position: relative;
			left: 30px;
		}
	</style>
</head>

<body>

	<h1>상대 위치(relative position) 지정 방식</h1>
	<div class="static">이 요소는 정적 위치 지정 방식으로 위치를 설정하였습니다.</div><br>
	<div class="relative">이 요소는 상대 위치 지정 방식으로 위치를 설정한 후, left 속성값을 30px로 설정하였습니다.</div><br>
	<p>상대 위치는 해당 HTML 요소의 정적 위치(static position)에 따라 위치를 재조정하는 방식입니다!</p>

</body>

</html>