[html/css] css hide scroll bar example / css 스크롤바 숨기는 방법

[html/css] css hide scroll bar example / css 스크롤바 숨기는 방법

 

특정영역에서

 

상하 스크롤은 동작하지만,

 

스크롤바는 숨기고 싶은 경우가 있습니다.

 

그럴때는 아래와 같이 하시면 됩니다.

 

 

예를들어 scroll_div 라는 아이디를 가지는

 

div 가 있다고 가정하고,

<div id="scroll_div" style="overflow-y: scroll;">
    테스트 영역입니다.
</div>

 

 

위 div 영역의 스크롤바를 

 

숨기고 싶으면 아래와 같이

 

css 를 추가하시면 됩니다.

 

#scroll_div {
    -ms-overflow-style: none; /* Explorer */
    scrollbar-width: none; /* Firefox */
}
#scroll_div::-webkit-scrollbar {
    display: none; /* Chrome */
}

 

위 내용대로 css 를 추가하면

 

브라우저 별로 다 동작하실 겁니다!

 

참고들 하세요!