본문 바로가기

반응형

position

(2)
Absolute absolute는 position 속성이 가지는 값 중에 하나입니다. 일반적으로 모든 요소는 요소의 흐름을 따라 코드가 설치된 순서대로 표시가 되는데요. absolute는 이러한 흐름에서 벗어나서 원하는 위치에 해당 요소를 위치시키도록 해줍니다. 사용방법 먼저, 관련된 속성들을 보겠습니다. top: 해당 요소가 들어있는 요소의 상단으로부터의 거리 bottom: 해당 요소가 들어있는 요소의 바닥으로부터의 거리 left: 해당 요소가 들어있는 요소의 좌측으로부터의 거리 right: 해당 요소가 들어있는 요소의 우측으로부터의 거리 absolute사용 시 부모요소의 position을 설정하지 않으면 root로부터 산정됩니다. This is a paragraph. 부모를 기준으로 위치를 지정하려면 아래와 같이 부..
Fixed fixed는 position 속성이 가지는 값 중에 하나입니다. 일반적으로 모든 요소는 요소의 흐름을 따라 코드가 설치된 순서대로 표시가 되는데요. fixed는 이러한 흐름에서 벗어나서 원하는 위치에 해당 요소를 위치시키도록 해줍니다. 사용방법 먼저, 관련된 속성들을 보겠습니다. top: root 상단으로 부터의 거리 bottom: root의 바닥으로부터의 거리 left: root의 좌측으로부터의 거리 right: root의 우측으로부터의 거리 Fixed fixed와 absolute 차이점은 fixed는 부모요소의 설정과 관계없이 무조건 windoe (screen)로부터 산정됩니다. 이러한 특성으로 콘텐츠의 길이와 상관없이 항상 화면에 같은 자리에 위치하여 내비게이션이나 모달 등에 유용하게 사용됩니다. ..

728x90