position의 가장 복잡한 속성 sticky와 z-index에 대해 알아보겠습니다. position과 position의 다른 속성들 css 속성 중 하나인 position의 다양한 타입들은 디자인적 명령을 수행하기에 최적화되어있습니다. 단순히 블록을 쌓듯 웹사이트를 만든다면 기능상에 큰 문제 없이 운영은 가능합니다. 그러나 인터넷 이용자가 늘어나고 기능이 발전되면서 우리가 이용하는 웹사이트들은 더욱 독특한 시도를 하고 심미적으로 만족스럽게 변화하고자 하는 경향을 가지게 되었습니다. position은 기존에 블록처럼 쌓여있는 웹 화면의 구성 요소들을 유동적으로 움직여 다양한 커스텀이나 시각적 변화를 가져올 수 있도록 합니다.  position에는 오늘 다룰 sticky를 제외하고도 static, rel..

css 속성 중 하나인 position과 z-index에 대하여 알아보겠습니다. Positionposition은 지정된 태그의 위치를 임의로 띄워 조정하는 태그입니다. top, bottom, left, right 을 추가로 입력하여 요소의 상대적인 위치를 지정할 수 있습니다. 이때 top, bottom, left, right로 입력된 수치는 해당 방향으로 그만큼 떨어지게 되는 것을 의미합니다. 에를 들어 top: 20px; left:20px; 은 해당 요소를 위로부터 20px, 왼쪽으로부터 20px 떨어트려 놓으라는 의미가 됩니다.static position의 가장 기본적인 상태입니다. 사용자가 임의로 position 속성을 변경하지 않는다면 태그는 자동으로 position : static의 상태를 가집..

input 태그 타입 radio와 checkbox를 css를 사용하여 커스텀 하는 방법에 대하여 알아보겠습니다. 본 내용에 들어가기 앞서 input 태그에 관한 기초적인 사용 설명은 이전 포스팅 'input 와 label 태그 활용하기'를 참조해 주세요^^ https://salt-planet.com/entry/input-%EC%99%80-label%ED%83%9C%EA%B7%B8-%EC%82%AC%EC%9A%A9%ED%95%98%EA%B8%B0 input 와 label태그 사용하기웹 사이트를 만드는 데 중요하게 사용되는 input 태그의 종류와 label 태그의 사용법에 대해서 정리해 보겠습니다. input과 labelinput과 label은 한 쌍으로 이루어진 태그입니다. 웹 접근성을 통과하기salt-..