기타

[Tistory] 티스토리 블로그 스크롤바 커스텀하기

헹창 2020. 8. 31.
반응형

[Tistory] 티스토리 블로그 스크롤바 커스텀하기

 

 

 

 

티스토리 스크롤바가 브라우저에서 제공하는 기본 스타일을 갖고 있어서 커스텀을 통해 이쁘게 바꾸려고 한다.

 

 

 

 

 

 

관리자 페이지에서 "꾸미기" - "스킨편집" 클릭한 후 "html 편집"을 누른다.

 

 

 

 

 

 

 

CSS 탭을 클릭한 뒤 아래와 같은 코드를 추가한다.

 

::-webkit-scrollbar {
	width: 10px;  /* 세로축 스크롤바 길이 */
	height: 20px;  /* 가로축 스크롤바 길이 */
}
::-webkit-scrollbar-button:start {
	background-color: white; /* Top, Left 방향의 이동버튼 */
}
::-webkit-scrollbar-button:end {
	background-color: white; /* Bottom, Right 방향의 이동버튼 */
}
::-webkit-scrollbar-track-piece {
	background-color: white;	/*스크롤 바 배경 색상*/
}
::-webkit-scrollbar-thumb {
	border-radius: 8px;
	background-color: gray; /*스크롤 바 색상*/
}

 

 

 

 

짜잔 ! 모던 & 심플하게 커스텀이 완료되었다.

 

 

 

 

 

 

728x90
반응형

댓글

추천 글