CSS实例scrollbar滚动条颜色的设置详解
<body style="scrollbar-arrow-color:yellow;scrollbar-base-color:lightsalmon"> ********************* <STYLE>{ SCROLLBAR-FACE-COLOR:#3399cc; SCROLLBAR-HIGHLIGHT-COLOR: white; SCROLLBAR-SHADOW-COLOR: white; SCROLLBAR-ARROW-COLOR: #ffffff; SCROLLBAR-BASE-COLOR:#dff0c0} </STYLE>
其中SCROLLBAR-FACE-COLOR、SCROLLBAR-HIGHLIGHT-COLOR、SCROLLBAR-SHADOW-COLOR、SCROLLBAR-ARROW-COLOR、SCROLLBAR-BASE-COLOR、SCROLLBAR-DARKSHADOW-COLOR分别用于指定滚动条不同部分的颜色(根据意思就知道它们分别代表了滚动条的什么部分)。
只需在页面HTML代码之间加这几行代码即可!!!!
:)
**********************************************
滚动条即网页右侧(下面)的竖向(横向)条。滚动条的颜色可以通过写CSS样式表,得到改变。
本页面就用到了绿色的滚动条。
滚动条的CSS样式表 :
<style> BODY { scrollbar-face-color: #008000; scrollbar-highlight-color: #0B0E2F; scrollbar-3dlight-color: #0B0E2F; scrollbar-darkshadow-color: #0B0E2F; scrollbar-shadow-color: #003366; scrollbar-arrow-color: #003366; scrollbar-track-color: #FFFFFF;} </style>
CSS样式表的作用是控制网站的字体样式,色彩样式,鼠标样式
是以 <style> 开头, </style> 结束的形式。
其中绿色代码
scrollbar-face-color: #008000;--滚动条条棒的颜色
scrollbar-highlight-color: #0B0E2F;--滚动条高光的颜色
scrollbar-3dlight-color: #0B0E2F;--滚动条3D的颜色
scrollbar-darkshadow-color: #0B0E2F;--滚动条深阴影的颜色
scrollbar-shadow-color: #003366;--滚动条阴影的颜色
scrollbar-arrow-color: #003366;--滚动条箭头的颜色
scrollbar-track-color: #FFFFFF;}--滚动条背景的颜色
????
????
“#008000”是色彩的三原色代码,可以自己随意调色,替换成不同的颜色。
*******************************************************************
<STYLE> BODY { SCROLLBAR-FACE-COLOR: #fc0000; SCROLLBAR-HIGHLIGHT-COLOR: #fc0000; SCROLLBAR-SHADOW-COLOR: #fc0000; SCROLLBAR-3DLIGHT-COLOR: #fc0000; SCROLLBAR-ARROW-COLOR: #fcfc00; SCROLLBAR-TRACK-COLOR: #fc4800; SCROLLBAR-DARKSHADOW-COLOR: #fc0000; SCROLLBAR-BASE-COLOR: #fc0000 } </STYLE>
*******************************************************************
body { font-size:9pt; color:#000099; cursor:url(meng.cur); OVERFLOW-X : auto; OVERFLOW: scroll; SCROLLBAR-FACE-COLOR: #817af3; SCROLLBAR-HIGHLIGHT-COLOR: #817af3; SCROLLBAR-SHADOW-COLOR: #000000; SCROLLBAR-3DLIGHT-COLOR: #817af3; SCROLLBAR-ARROW-COLOR: #e8f7e6; SCROLLBAR-TRACK-COLOR: 817af3 SCROLLBAR-DARKSHADOW-COLOR: #e8f7e6; }
332分屏滚动条颜色设置
set Time out(function setScrollbar(){ //color=Array (面部颜色,上左斜面,下右斜面,上左边沿,箭头,底版色,下右边沿) color=Array("#EDE6DA","#EDE6DA","#EDE6DA","#EDE6DA","#84674A","#EDE6DA","#EDE6DA"); box=Array("u","u1","d","r") for (var i=0;i<box.length;i++){ eval("parent."+box[i]+". document .body.style.scrollbarFaceColor=color[0]"); eval("parent."+box[i]+".document.body.style.scrollbarHighlightColor=color[1]"); eval("parent."+box[i]+".document.body.style.scrollbarShadowColor=color[2]"); eval("parent."+box[i]+".document.body.style.scrollbar3dLightColor=color[3]"); eval("parent."+box[i]+".document.body.style.scrollbarArrowColor=color[4]"); eval("parent."+box[i]+".document.body.style.scrollbarTrackColor=color[5]"); eval("parent."+box[i]+".document.body.style.scrollbarDarkShadowColor=color[6]"); }; setTimeout("setScrollbar()",300); },300);
以上就是CSS实例scrollbar滚动条颜色的设置详解的详细内容,更多请关注其它相关文章!