테스트 사이트 - 개발 중인 베타 버전입니다

CSS 레이아웃 - position: relative; 속성

· 8년 전 · 2876 · 1

CSS 레이아웃 - position: relative; 속성

 

position: relative;

 

의 요소 position: relative;는 그 통상의 위치에 상대적으로 배치됩니다.

 

상대적으로 배치 된 요소의 위쪽, 오른쪽, 아래쪽 및 왼쪽 속성을 설정하면 해당 요소가 정상 위치에서 벗어나 조정됩니다. 다른 콘텐츠는 요소가 남긴 모든 틈에 맞춰 조정되지 않습니다.

 

이 <div> 요소의 위치는 relative입니다.

다음은 사용 된 CSS입니다.

 

div.relative {

    position: relative;

    left: 30px;

    border: 3px solid #73AD21;

}

 

 

<!DOCTYPE html>

<html>

<head>

<style>

div.relative {

    position: relative;

    left: 30px;

    border: 3px solid #73AD21;

}

</style>

</head>

<body>

 

<h2>position: relative;</h2>

 

<p>An element with position: relative; is positioned relative to its normal position:</p>

 

<div class="relative">

This div element has position: relative;

</div>

 

</body>

</html>

 


 

댓글 작성

댓글을 작성하시려면 로그인이 필요합니다.

로그인하기

댓글 1개

좋은정보입니다

게시글 목록

번호 제목
3087
3086
3085
3084
3083
3082
3081
3080
3079
3078
3077
3076
3075
3074
3073
3072
3071
3070
3069
3068
3067
3065
3064
3063
3062
3061
3060
3059
3058
3057