CSS 레이아웃 - position static 속성

컴프

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

· 8년 전 · 조회 2501 2501

CSS 레이아웃 - position 속성

이 position속성은 요소에 사용되는 위치 지정 방법의 유형 (정적, 상대적, 고정 또는 절대)을 지정합니다.

position 속성

이 position속성은 요소에 사용되는 위치 지정 방법의 유형을 지정합니다.

네 가지 위치 값이 있습니다.

- static

- relative

- fixed

- absolute

그런 다음 요소는 위쪽, 아래쪽, 왼쪽 및 오른쪽 속성을 사용하여 배치됩니다. 그러나 position 속성을 먼저 설정 하지 않으면 이러한 속성이 작동하지 않습니다 . 또한 위치 값에 따라 다르게 작동합니다.

position : static;

HTML 요소는 기본적으로 정적으로 배치됩니다.

정적으로 배치 된 요소는 위쪽, 아래쪽, 왼쪽 및 오른쪽 속성의 영향을받지 않습니다.

요소 position: static;는 특별한 방법으로 배치되지 않습니다. 페이지의 정상적인 흐름에 따라 항상 배치됩니다.

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

다음은 사용 된 CSS입니다.

div.static {

position: static;

border: 3px solid #73AD21;

}

<!DOCTYPE html>

<html>

<head>

<style>

div.static {

position: static;

border: 3px solid #73AD21;

}

</style>

</head>

<body>

<h2>position: static;</h2>

<p>An element with position: static; is not positioned in any special way; it is

always positioned according to the normal flow of the page:</p>

This div element has position: static;

</div>

</body>

</html>

댓글 작성

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

로그인하기

게시판 목록

퍼블리셔팁

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

글쓰기

번호	분류	제목	글쓴이	날짜	조회
137	HTML	테이블안에 있는 글 자동 정렬하기 [1]	작은새 프로필 보기 이 회원 글보기 이 회원의 댓글보기	19년 전	3777
136	HTML	Ajax강의- 첫번째 강의의 pdf중 발표문건 61-65	pearly 프로필 보기 이 회원 글보기 이 회원의 댓글보기	19년 전	4131
135	HTML	Fedora Core FTP로 설치 [3]	관리자 프로필 보기 이 회원 글보기 이 회원의 댓글보기	19년 전	4233
134	HTML	Ajax강의- 첫번째 강의의 pdf중 발표문건 21-30	pearly 프로필 보기 이 회원 글보기 이 회원의 댓글보기	19년 전	4647
133	HTML	전체화면으로 페이지 열기	Elbis 프로필 보기 이 회원 글보기 이 회원의 댓글보기	19년 전	3272
132	HTML	이번에는 텍스트영역에서 메세지별로 타이핑 시킵니다	Elbis 프로필 보기 이 회원 글보기 이 회원의 댓글보기	19년 전	3132
131	HTML	텍스트 상자에서 메세지가 타이핑 됩니다	Elbis 프로필 보기 이 회원 글보기 이 회원의 댓글보기	19년 전	2807
130	HTML	오늘 날짜와 요일 넣기 [1]	Elbis 프로필 보기 이 회원 글보기 이 회원의 댓글보기	19년 전	3684
129	HTML	창의 사이즈 변경 금지 시키기 [1]	Elbis 프로필 보기 이 회원 글보기 이 회원의 댓글보기	19년 전	2746
128	HTML	손님의 방문 횟수를 알려 줍니다	Elbis 프로필 보기 이 회원 글보기 이 회원의 댓글보기	19년 전	3338
127	HTML	자바스크립트 버튼에 링크 걸기	Elbis 프로필 보기 이 회원 글보기 이 회원의 댓글보기	19년 전	8592
126	HTML	이름을 물어보고 인사하는 스크립트	Elbis 프로필 보기 이 회원 글보기 이 회원의 댓글보기	19년 전	2540
125	HTML	폼 버튼을 클릭하면 경고 메세지 보내기	Elbis 프로필 보기 이 회원 글보기 이 회원의 댓글보기	19년 전	3006
124	HTML	포토샵 작업 중에 잘되던 한글 입력이 갑자기 안될때 있으시죠? [5]	두루굳센™ 프로필 보기 이 회원 글보기 이 회원의 댓글보기	19년 전	5354
123	HTML	버튼에 스타일주기(익스)	MCLUB 프로필 보기 이 회원 글보기 이 회원의 댓글보기	19년 전	2928
122	HTML	오른쪽마우스클릭시메뉴(익스전용)	MCLUB 프로필 보기 이 회원 글보기 이 회원의 댓글보기	19년 전	2836
121	HTML	오른쪽마우스클릭시메뉴(익스전용)	MCLUB 프로필 보기 이 회원 글보기 이 회원의 댓글보기	19년 전	3434
120	HTML	영카트에서 카테고리 검색하기	rolo 프로필 보기 이 회원 글보기 이 회원의 댓글보기	19년 전	3198
119	HTML	자바스크립트로 url 획득	MCLUB 프로필 보기 이 회원 글보기 이 회원의 댓글보기	19년 전	3184
118	HTML	포샾 팁강좌입니다...퍼온 것입니다. [3]	버섯도리 프로필 보기 이 회원 글보기 이 회원의 댓글보기	19년 전	5069
117	HTML	투명도조절 [2]	MCLUB 프로필 보기 이 회원 글보기 이 회원의 댓글보기	19년 전	3647
116	HTML	textarea에 입력된 길이만큼 게이지로 표현	유자 프로필 보기 이 회원 글보기 이 회원의 댓글보기	19년 전	3506
115	HTML	버튼 하나로 링크두개를 열어보자	유자 프로필 보기 이 회원 글보기 이 회원의 댓글보기	19년 전	3897
114	HTML	[펌]다중 업로드	강강술냄세 프로필 보기 이 회원 글보기 이 회원의 댓글보기	19년 전	3857
113	HTML	포토샵에서 제가 간단하게 쓰는 점선 쓰는 방법입니다 [5]	yunni 프로필 보기 이 회원 글보기 이 회원의 댓글보기	19년 전	5281
112	HTML	register_globals = on /off 차이점	드렁크수달스 프로필 보기 이 회원 글보기 이 회원의 댓글보기	19년 전	3611
111	HTML	밑의 갤러리 압축 화일 [4]	진아맘 프로필 보기 이 회원 글보기 이 회원의 댓글보기	19년 전	4091
110	HTML	getElementById와 getElementsByName	드렁크수달스 프로필 보기 이 회원 글보기 이 회원의 댓글보기	19년 전	3520
109	HTML	[소개] smtp를 이용하여 mail 보내기	rolo 프로필 보기 이 회원 글보기 이 회원의 댓글보기	19년 전	4863
108	HTML	cart클래스2	홀로남은자 프로필 보기 이 회원 글보기 이 회원의 댓글보기	19년 전	2977