스티키(sticky)와 백드롭 필터(backdrop-filter) 효과를 함께 사용하여 스크롤 시 제목이 항상 보이면서 배경이 흐려지는 효과를 구현할 수도 있습니다.
backdrop-filter: blur(10px); /* 바닥을 뿌옇게 만들기 */
스티키 요소 뒤의 배경을 흐리게 만듭니다. 이 속성은 요소의 배경을 흐리게 만들지만 요소 자체는 흐리게 하지 않습니다.
💡 스크롤바 커스텀하기 CSS scrollbar 관련 선택자들은표준이 아니기 때문에 문법 적용을 각 브라우저마다 다르게 해야합니다. WebKit 기반 브라우저(Chrome, Edge, Opera, Safari, iOS 브라우저)와 IE와 파이어폭스 브라우저로 나뉩니다.(사람들이 대부분 사용하는 브라우저들은 Chrome, Edge, Safari 등이 있으니, 여기서는 Webkit 기반 속성만 설명하겠습니다.)
::-webkit-scrollbar
⇒ ppt 추가되는 내용 확인 후, 내용 수정하기(스크롤바 넓이 none)