Dandy Now!
728x90
반응형
방명록
[ 프로젝트/[팀] 겸상 - 혼밥 매칭 ]
[팀] 겸상 - CSS의 z-index로 HTML요소에 우선순위 부여하여 sticky 적용한 요소를 화면 전면에 위치시키기
2022-06-20 18:56:10
포토샵에서 레이어의 위치를 조정하듯 원하는 HTML 요소를 화면에서 가장 위쪽에 보이도록 할 필요가 있었다. [그림 1]의 "함께할 숟갈"에 sticky를 적용하여 스크롤을 내리면 화면 최상단에 고정되게 하였다. 그런데 "함께할 숟갈"이 화면의 전면에 위치하지 않고 뒤로 숨어버리는 문제가 발생하였다. 원했던 결과는 "함께할 숟갈"이 [그림 3]과 같이 화면의 가장 앞쪽에 표시되도록 하는 것이었다. 이때 z-index를 이용하여 HTML 요소에 우선순위를 지정하면 간단히 해결할 수 있었다.
NEW
prev
1
next
728x90
반응형
최신버전 안내
현재 적용된 Stroke 스킨의 버전이 최신버전이 아닙니다.
최신버전의 스킨 파일을 다운로드 받을 수 있는 페이지로 이동하시겠습니까?
(* 이 모달창은 블로그 관리자에게만 표시됩니다.)
30일 동안 열지 않음
예
티스토리툴바
Dandy Now!
구독하기