jQuery | javascript | CSS

18.CSS - 스크롤바-스타일 지정

Godffs 2009. 7. 29. 03:19
반응형

스크롤바의 스타일을 지정하여 자신만의 스크롤바를 만들 수 있습니다.

  •  scrollbar
    • 3dlight-color : 스크롤 박스와 화살표 박스의 상단과 왼쪽 가장 자리에 색상
    • arrow-color : 화살표 박스의 화살표색상
    • base-color : arrow, shadow, darkshadow를 제외한 기본적인 곳
    • darkshadow-color : 스크롤박스, 화살표 박스의 하단, 오른쪽 가장 자리 색상
    • face-color : 스크롤 박스와 화살표 박스 그리고 트랙의 표면
    • highlight-color : 왼쪽 가장 자리의 겉 색상                                
    • shadow-color : 스크롤 박스, 화살표 박스의 하단과 오른쪽의 그림자 부분

스크롤바 스타일 변경 예제 입니다.

 <style type="text/css">
        body
        {
              scrollbar-3dlight-color:;
           scrollbar-arrow-color:teal;
           scrollbar-base-color:;

그림18-1


           scrollbar-darkshadow-color:blue;
           scrollbar-face-color:orange;
           scrollbar-highlight-color:chartreuse;
           scrollbar-shadow-color:hotpink
        }
    </style>

실제 적용한 화면입니다. 입력해보세요~

스크롤바 스타일 적용 확인은 IE(InterExplorer)에서만 확인 가능합니다.
반응형