[CSS] overflow-y:scroll 디자인하기 스크롤 디자인 변경하는 CSS

overflow-y:scroll로 스크롤 사용 가능하다.

기본 스크롤도 충분히지만

쫌더 통일성 있는 디자인을위해

스크롤 색상과 모양 디자인을 변경하는 CSS를 추가했다

 

이미지 표의 오른쪽 스크롤 이다.

.accodient-box{
  overflow-y: scroll;
}


.accodient-box::-webkit-scrollbar {
  width: 10px;  /* 스크롤바의 너비 */
}
.accodient-box::-webkit-scrollbar-thumb {
  height: 30%; /* 스크롤바의 길이 */
  background: #848484; /* 스크롤바의 색상 */
  border-radius: 10px;
}

.accodient-box::-webkit-scrollbar-track {
  background: #84848447;  /*스크롤바 뒷 배경 색상*/
}