position sticky 특징 position : fixed 의 경우 view port 에 고정되지만 sticky 의 경우 scroll box에 고정되는 특징이 존재한다. 쉽게말해 sticky 속성을 적용한 div 박스의 offset top 값이 0이 될 경우 top에 고정되는 속성이 있다. 위와 같은 level 에 sticky 와 relative 값을 준 두가지 박스가 존재 할 때 스크롤을 했을 때 sticky 속성을 적용한 box가 relative 속성을 적용한 박스 뒤에 가려지는 상황이 존재한다. 이때 아래와 같이 sticky 값을 준 box 에 relative 보다 z-index 값을 높에 적용하면 가려지지 않게 된다.

LESS SASS = CSS + JS 파일명.less => 컴파일 => 정규 css 코드 lesscss.org https://sass-lang.com/ Sass: Syntactically Awesome Style Sheets Sass is the most mature, stable, and powerful professional grade CSS extension language in the world. sass-lang.com https://sass-guidelin.es/ko/#section-42 Sass Guidelines — Korean translation 분별 있고, 유지∙확장 가능한 Sass 작성을 위한 주관적인 스타일가이드. sass-guidelin.es https://www.sassmeis..

rem은 root em이라는 뜻으로, HTML 문서의 root 요소인 을 가리키며, 이 요소에 지정된 크기를 기준으로 상대적인 값을 가지게 된다는 것이다. em 사용 - 부모로부터 글꼴 크기를 상속받음 html = 100% = 16px body = 0.5em = 8px div = 0.5em = 4px p = 0.5em = 2px rem 사용 - 로부터 크기를 상속받음 html = 100% = 16px body = 0.5rem = 8px div = 0.5rem = 8px p = 0.5rem = 8px 사용 상황 예시 단말기의 해상도에 따라 기본 글꼴 크기를 전체적으로 다르게 제어할 필요가 있을 때 미디어쿼리와 함께 rem 단위를 사용하면 효과적입니다. 예를 들어 데스크톱 글꼴이 10px ~ 20px 범위인..