滚动条样式设计IE支持

1、 控制横向和纵向滚动条的显隐

去掉滚动条 x 轴 <body > 
     去掉滚动条 y 轴 <body > 
     滚动条 x/y 轴全部去掉 <body scroll="no">

    2、滚动条颜色

     <style> 
     BODY{ 
     SCROLLBAR-FACE-COLOR: #ffffff; 
     SCROLLBAR-HIGHLIGHT-COLOR: #ffffff; 
     SCROLLBAR-SHADOW-COLOR: #ffffff; 
     SCROLLBAR-3DLIGHT-COLOR: #ffffff; 
     SCROLLBAR-ARROW-COLOR: #ffffff; 
     SCROLLBAR-TRACK-COLOR: #eeeeee; 
     SCROLLBAR-DARKSHADOW-COLOR: #FFFFFF;} 
     </style>

     SCROLLBAR-FACE-COLOR 滚动条凸出部分的颜色 
     SCROLLBAR-HIGHLIGHT-COLOR 滚动条空白部分的颜色 
     SCROLLBAR-SHADOW-COLOR 立体滚动条阴影的颜色 
     SCROLLBAR-3DLIGHT-COLOR 滚动条亮边的颜色 
     SCROLLBAR-ARROW-COLOR 上下按钮上三角箭头的颜色 
     SCROLLBAR-TRACK-COLOR 滚动条的背景颜色 
     SCROLLBAR-DARKSHADOW-COLOR 滚动条强阴影的颜色 
     SCROLLBAR-BASE-COLOR 滚动条的基本颜色

    3、 箭行符号滚动条代码

<style type="text/css"> 
     <!-- 
     BODY {scrollbar-face-color: white; 
     scrollbar-highlight-color: white; 
     scrollbar-shadow-color: white; 
     scrollbar-3dlight-color: white; 
     scrollbar-arrow-color: hotpink; 
     scrollbar-track-color: white; 
     scrollbar-darkshadow-color: white} 
     --> 
     </style>

    4、 一侧滚动条代码

     <style type="text/css"> 
     <!-- 
     BODY {scrollbar-face-color: white; 
     scrollbar-highlight-color: white; 
     scrollbar-shadow-color: hotpink; 
     scrollbar-3dlight-color: white; 
     scrollbar-arrow-color: hotpink; 
     scrollbar-track-color: white; 
     scrollbar-darkshadow-color: white} 
     --> 
     </style>

    5、 朴素型滚动条代码

     <style type="text/css"> 
     <!-- 
     BODY { 
     scrollbar-face-color: white; 
     scrollbar-highlight-color: hotpink; 
     scrollbar-shadow-color: hotpink; 
     scrollbar-3dlight-color: white; 
     scrollbar-arrow-color: hotpink; 
     scrollbar-track-color: white; 
     scrollbar-darkshadow-color: white} 
     --> 
     </style>

    6、一侧滚动条代码

<style type="text/css"> 
     <!-- 
     BODY {scrollbar-face-color: white; 
     scrollbar-highlight-color: white; 
     scrollbar-shadow-color: hotpink; 
     scrollbar-3dlight-color: white; 
     scrollbar-arrow-color: hotpink; 
     scrollbar-track-color: white; 
     scrollbar-darkshadow-color: white} 
     --> 
     </style>

    7、 立体型滚动条代码

     <style type="text/css"> 
     <!-- 
     BODY {scrollbar-face-color: pink; 
     scrollbar-highlight-color: deeppink; 
     scrollbar-shadow-color: lavenderblush; 
     scrollbar-3dlight-color: lavenderblush; 
     scrollbar-arrow-color: white; 
     scrollbar-track-color: lavenderblush; 
     scrollbar-darkshadow-color: deeppink} 
     --> 
     </style>

posted @ 2011-11-18 01:53  潺莪  阅读(231)  评论(0编辑  收藏  举报