코딩을 하다가 보면 css에서 position이라는 부분을 종종 보게 된다.
사실 단어의 뜻만 알면 그리 어렵지 않게 뜻을 알 수가 있다.
예를 들어 보자.
위 두 코드는 다른 점이라고는 딱 한 가지!
position이다.
absolute, relative 이 두 가진데 전자는 절대적이고 후자는 상대적이다.
절대 위치라고 하면 우리가 보는 모니터의 가장 좌측 최상단(좌표는 0, 0)이다.
반대로 상대 위치라고 하는 건 위에 녀석과는 반대의 개념이겠다.
지금 위의 저 코드 같은 경우는 실행을 했을 때 똑같은 위치에 겹쳐져서 나온다.
<div id="firstLayer"></div> 이것과 <div id="secondLayer"></div> 이 사이에 <br />을 몇 개 넣어 보아라.
그러면 무슨 말인가 알게 될 것이다.
absolute의 경우는 어디에 넣어놓든 무조건 시작 위치는 브라우져의 가장 좌측 최상단이고, relative는 자기가 시작되는 지점에서부터이다.
이해가 안 된다면 직접 코드를 끄적여 보는 것이 가장 좋은 방법이다.
'Programming > HTML/CSS' 카테고리의 다른 글
| ruby (4) | 2008/07/01 |
|---|---|
| css로 이미지 리스팅 하기 (0) | 2007/11/16 |
| css에서 position (8) | 2007/09/04 |
| 이미지에 마우스 오버 시 박스(저장, 프린트 등등) 뜨는 것 나타나지 않게 하기 (2) | 2007/06/22 |
| 폼에서 한글/영어 전환키 쓰지 않고 입력(ime-mode) (4) | 2007/02/21 |
| select box 그룹별로 묶기 (2) | 2007/01/24 |
댓글을 달아 주세요
모....모르는 거다;;;
2007/09/04 23:51 [ ADDR : EDIT/ DEL : REPLY ]그게 뭐야?
몰라
무서워////ㅠㅠ
사실 저도 모르는 거예요. *^^*
2007/09/05 09:06 [ ADDR : EDIT/ DEL ]걍 어딘가에 있는 거 긁어다 온 검미다!
저두 먼 말인지 모르겠지만,
2007/09/05 10:40 [ ADDR : EDIT/ DEL : REPLY ]어쨌거나 레이아웃이 복잡해 지면 복잡해 질 수록 저 속성의 조합때문에 머리가 뽀개 지기 시작하죠... (-_-)ㅋ
아니 이건...
2007/09/05 11:06 [ ADDR : EDIT/ DEL ]Lane 님은 아시는 건데요??
흐흐흐
오~ 유용한 정보네요~ 고맙습니다!
2007/09/05 15:14 [ ADDR : EDIT/ DEL : REPLY ]머릿속에 클립 ㅎㅎ
not at all.
2007/09/05 17:44 [ ADDR : EDIT/ DEL ]큭큭;
멍충이 님 자제영!!!
"absolute의 경우는 어디에 넣어놓든 무조건 시작 위치는 모니터의 가장 좌측 최상단이고"에서 모니터의 가장 좌측 상단이 아니라 브라우저죠
2007/12/06 10:41 [ ADDR : EDIT/ DEL : REPLY ]앗, 지적 감사합니다.
2007/12/06 16:27 [ ADDR : EDIT/ DEL ]지금 읽어 보니...ㅋㅋ
어처구니 없네요. ㅋㅋ
아 챙피해.