728x90
반응형
Scrollbar에 css로 디자인을 적용할 수 있습니다.
::-webkit-scrollbar {
/* 스크롤바 전체 영역 */
width: 10px;
}
::-webkit-scrollbar-track {
/* 스크롤이 움직이는 영역 */
background-color: #f9f9f9;
}
::-webkit-scrollbar-thumb {
/* 스크롤 */
background-color: gold;
border-radius:30px;
}
::-webkit-scrollbar-button:start:decrement,
::-webkit-scrollbar-button:end:increment {
/* 스크롤의 화살표가 포함된 영역 */
display:block;
height:8px;
background-color: #000;
}
::-webkit-scrollbar-corner {
/* 상하+좌우 스크롤이 만나는 공간 */
background-color: red;
}
/* 스크롤 상하방향 */
::-webkit-scrollbar-button:vertical:incremen
::-webkit-scrollbar-button:vertical:decrement
/* 스크롤 좌우방향 */
::-webkit-scrollbar-button:horizontal:increment
::-webkit-scrollbar-button:horizontal:decrement
728x90
반응형
'CSS > CSS 응용' 카테고리의 다른 글
[CSS]별점효과 구현하기 (5) | 2019.06.10 |
---|---|
[CSS] Button animation 버튼 애니메이션 효과 (0) | 2019.05.31 |
[CSS]3D 막대그래프 그리기 (252) | 2019.05.30 |
[CSS]버튼에 쓸수 있는 애니메이션 (391) | 2019.05.30 |
[CSS]종이 끝이 살짝 떠있는듯한 효과 (377) | 2019.05.29 |
댓글