728x90 absolute2 HTML/CSS - position(2) 안녕하세요, 이전에 position에 관하여 정리를 했었는데요, 추가로 간략히 정리할 겸 sticky 속성 값까지 추가하여 정리해보려 합니다. position은 요소의 위치 지정 방법의 유형(기준)을 설정하는 속성입니다. ◆ position의 속성 값 -. static : 요소의 기준이 없음/ 배치 불가능 (기본값) -. relative : 요소 자신을 기준으로 배치 -. absolute : 위치 상 부모 요소를 기준으로 배치 (위치 상 부모요소 : position 속성이 부여되어 있는 요소!) -. fixed : 브라우저(뷰포트)를 기준으로 배치 -. sticky : 스크롤 영역 기준으로 배치 position 속성을 사용하면 실질적으로 이동은 top, bottom, left, right 속성에 의해 정.. 2021. 6. 6. HTML/CSS - Position 안녕하세요, 오늘은 position에 대해 정리하려 합니다. position 설정을 해주지 않으면 요소들은 static position 상태입니다. [포지셔닝이 안 된 요소] 여기 상태에서 Relative/Fixed/Absolute 등 position 설정이 가능합니다. [포지셔닝이 된 요소] ◆ Relative position : 원래 자신의 자리를 기준으로 위치를 잡는 것 위와 같이 blue 클래스에 relative 포지션을 적용하면 아래와 같이 결과가 나오게 됩니다. (blue 박스가 초기 위치에 상대적으로 이동하게 됩니다 [위로 50px, 왼쪽으로 70px 공간이 나오게 이동] ) ◆ Fixed position : 브라우저 윈도우를 기준으로 위치를 잡는 것 ◆ Absolute position : .. 2021. 5. 18. 이전 1 다음
