CSS의 `position` 속성은 문서 상에 요소를 배치하는 방법을 지정합니다.`static`, `relative`, `absolute`, `fixed`, `sticky`와 같은 속성을 사용해 요소를 배치할 수 있습니다.각 속성은 아래와 같은 특징이 있습니다.`static` : 요소를 일반적인 문서 흐름에 따라 배치합니다. 이는 기본값으로, 모든 요소는 별도 position 값을 지정하지 않으면 static이 적용됩니다.`relative` : static의 특성을 가지면서 자신을 기준으로 top, right, bottom, left의 값에 따라 오프셋을 적용할 수 있습니다. 다른 요소들에는 영향을 주지 않고 해당 요소만 이동됩니다.`absolute` : 요소를 일반적인 문서 흐름에서 제거하고, 가장 가..
728x90
반응형
CSS
reflow와 repaint는 웹 페이지가 렌더링 되는 과정에서 발생하는 작업들이다. reflowreflow는 브라우저가 페이지의 레이아웃을 다시 계산하는 과정을 말한다.DOM 구조가 변경되거나 CSS 스타일이 변경되면, 브라우저는 각 요소가 화면에 어떻게 배치될지 다시 계산을 해야한다.이 과정에서 모든 자식 요소와 관련된 부모 요소까지 영향을 주기 때문에 비용이 많이 소요되는 작업이다.너비(width)나 높이(height) 속성을 수정하게 되면, 브라우저는 해당 요소뿐만이 아니라 연관된 모든 요소의 배치를 다시 계산해야 한다. repaintrepaint는 요소의 모양이나 스타일이 변경될 때 발생한다. 요소의 레이아웃은 그대로이고, 색상이나 배경 등의 스타일만 변경되는 경우를 말한다.background-..
728x90
반응형