CSS position:sticky로 헤더·타일 화면 상단에 고정시키기
페이지 정보
조회 189회
작성일 23-10-23 13:35
position:sticky를 이용해 헤더나 타일 요소를 스크롤 중 화면에 고정시키는 방법을 보여주는 CodePen 예제다. 스크롤 위치가 top 기준점을 지나기 전에는 일반 문서 흐름을 유지하다가, 지나간 뒤에는 화면에 붙어 따라오는 sticky 동작을 JavaScript 없이 CSS만으로 구현한다.
See the Pen Untitled by H J (@H-J-the-typescripter) on CodePen.
- 다음글디자이너가 꼭 알아야 할 기초 지식 - 이론·소프트웨어·인쇄 20.05.04