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

컴프

프로필 보기 이 회원 글보기 이 회원의 댓글보기

· 8년 전 · 조회 2896 2896 · 댓글 1 1

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>

This div element has position: relative;

</div>

</body>

</html>

댓글 작성

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

로그인하기

댓글 1개

비밀이

프로필 보기 이 회원 글보기 이 회원의 댓글보기

8년 전

좋은정보입니다

게시판 목록

퍼블리셔팁

퍼블리싱과 관련된 유용한 정보를 공유하세요.
질문은 상단의 QA에서 해주시기 바랍니다.

글쓰기

번호	분류	제목	글쓴이	날짜	조회
977	CSS	수직 탐색 막대 예제	컴프 프로필 보기 이 회원 글보기 이 회원의 댓글보기	8년 전	1667
976	CSS	Vertical Navigation Bar [1]	컴프 프로필 보기 이 회원 글보기 이 회원의 댓글보기	8년 전	2123
975	CSS	Navigation Bars	컴프 프로필 보기 이 회원 글보기 이 회원의 댓글보기	8년 전	1616
974	CSS	[CSS] Float : left, right, inherit, none.	이희현 프로필 보기 이 회원 글보기 이 회원의 댓글보기	8년 전	5254
973	CSS	CSS 투명한 호버 효과 2	컴프 프로필 보기 이 회원 글보기 이 회원의 댓글보기	8년 전	3255
972	CSS	CSS 투명한 호버 효과	컴프 프로필 보기 이 회원 글보기 이 회원의 댓글보기	8년 전	3053
971	CSS	CSS 불투명도 / 투명성	컴프 프로필 보기 이 회원 글보기 이 회원의 댓글보기	8년 전	2132
970	HTML	레이아웃용 테이블에<th>나scope이 사용될 경우에는 오류임.	위토즈 프로필 보기 이 회원 글보기 이 회원의 댓글보기	8년 전	3048
969	HTML	IE9 이전 버전에서 Canvas 사용가능하도록 하는 js 라이브러리 [2]	위토즈 프로필 보기 이 회원 글보기 이 회원의 댓글보기	8년 전	3525
968	CSS	CSS 결합 자 - 인접한 형제 선택기	컴프 프로필 보기 이 회원 글보기 이 회원의 댓글보기	8년 전	2447
967	CSS	CSS 결합 자 - 하위 선택자	컴프 프로필 보기 이 회원 글보기 이 회원의 댓글보기	8년 전	1939
966	CSS	CSS 결합 자 - 하위 선택기	컴프 프로필 보기 이 회원 글보기 이 회원의 댓글보기	8년 전	1701
965	CSS	CSS 레이아웃 - 이미지 센터하기	컴프 프로필 보기 이 회원 글보기 이 회원의 댓글보기	8년 전	2700
964	CSS	CSS 레이아웃 - 가운데 맞춤 텍스트	컴프 프로필 보기 이 회원 글보기 이 회원의 댓글보기	8년 전	2580
963	CSS	CSS 레이아웃 - 가운데 정렬 요소	컴프 프로필 보기 이 회원 글보기 이 회원의 댓글보기	8년 전	3113
962	CSS	float : The clearfix Hack(clearfix 해킹)	컴프 프로필 보기 이 회원 글보기 이 회원의 댓글보기	8년 전	1813
961	CSS	float : The clear Property(clear 속성)	컴프 프로필 보기 이 회원 글보기 이 회원의 댓글보기	8년 전	1500
960	CSS	CSS 레이아웃 - 플로팅 및 삭제	컴프 프로필 보기 이 회원 글보기 이 회원의 댓글보기	8년 전	2277
959	CSS	CSS Overflow auto	컴프 프로필 보기 이 회원 글보기 이 회원의 댓글보기	8년 전	1894
958	CSS	CSS Overflow Hidden	컴프 프로필 보기 이 회원 글보기 이 회원의 댓글보기	8년 전	2150
957	CSS	CSS Overflow Visible	컴프 프로필 보기 이 회원 글보기 이 회원의 댓글보기	8년 전	2190
956	CSS	css position Overlapping Elements(겹치는 요소들)	컴프 프로필 보기 이 회원 글보기 이 회원의 댓글보기	8년 전	2055
955	CSS	css position: absolute;	컴프 프로필 보기 이 회원 글보기 이 회원의 댓글보기	8년 전	2213
954	CSS	css position: fixed;	컴프 프로필 보기 이 회원 글보기 이 회원의 댓글보기	8년 전	2346
953	CSS	CSS 레이아웃 - position: relative; 속성 [1] 현재 보는 글	컴프 프로필 보기 이 회원 글보기 이 회원의 댓글보기	8년 전	2897
952	CSS	CSS 레이아웃 - position static 속성	컴프 프로필 보기 이 회원 글보기 이 회원의 댓글보기	8년 전	2504
951	CSS	너비, 최대 너비 및 여백 사용 : auto; 사용	컴프 프로필 보기 이 회원 글보기 이 회원의 댓글보기	8년 전	2383
950	CSS	display:block	컴프 프로필 보기 이 회원 글보기 이 회원의 댓글보기	8년 전	1863
949	CSS	Display: none;	컴프 프로필 보기 이 회원 글보기 이 회원의 댓글보기	8년 전	1911
948	CSS	display 속성	컴프 프로필 보기 이 회원 글보기 이 회원의 댓글보기	8년 전	2097