커스텀 스크롤바 만들기

커스텀 스크롤바

css

.scrollbar { 
	width: 300px;
    height: 300px;
    overflow: hidden;
    overflow-y: auto;
    background: lightskyblue;
}
.scrollbar::-webkit-scrollbar { 
	width: 6px; 
} 
.scrollbar::-webkit-scrollbar-thumb { 
	background: gray;
    border-radius: 6px;
}
.scrollbar::-webkit-scrollbar-track { 
	background: black; 
}

html

<div class="scrollbar">
        커스텀 스크롤바 커스텀 스크롤바 커스텀 스크롤바 커스텀 스크롤바 커스텀 스크롤바
        커스텀 스크롤바 커스텀 스크롤바 커스텀 스크롤바 커스텀 스크롤바 커스텀 스크롤바
        커스텀 스크롤바 커스텀 스크롤바 커스텀 스크롤바 커스텀 스크롤바 커스텀 스크롤바 
        커스텀 스크롤바 커스텀 스크롤바 커스텀 스크롤바 커스텀 스크롤바 커스텀 스크롤바
        커스텀 스크롤바 커스텀 스크롤바 커스텀 스크롤바 커스텀 스크롤바 커스텀 스크롤바
        커스텀 스크롤바 커스텀 스크롤바 커스텀 스크롤바 커스텀 스크롤바 커스텀 스크롤바 
        커스텀 스크롤바 커스텀 스크롤바 커스텀 스크롤바 커스텀 스크롤바 커스텀 스크롤바
        커스텀 스크롤바 커스텀 스크롤바 커스텀 스크롤바 커스텀 스크롤바 커스텀 스크롤바
        커스텀 스크롤바 커스텀 스크롤바 커스텀 스크롤바 커스텀 스크롤바 커스텀 스크롤바 
        커스텀 스크롤바 커스텀 스크롤바 커스텀 스크롤바 커스텀 스크롤바 커스텀 스크롤바
        커스텀 스크롤바 커스텀 스크롤바 커스텀 스크롤바 커스텀 스크롤바 커스텀 스크롤바
        커스텀 스크롤바 커스텀 스크롤바 커스텀 스크롤바 커스텀 스크롤바 커스텀 스크롤바 
 </div>