《流行歌曲》

如何增滚动条，以及更改滚动条的颜色

                                      

      问：如何增加在线留言、在线评论滚动条，以及更改滚动条的颜色？
      答：                               
      （1）改友情博客链接自带的滚动条的颜色。先找到以下代码：

　　div.friendBlogDIV{

　　overflow: auto;

　　font-family: Arial,Helvetica,sans-serif;

　　font-size: 9pt;

　　line-height: 18px;

　　color: #000000;

　　text-decoration: none;

　　height:250px;

　　SCROLLBAR-FACE-COLOR: #FFDDAA;

　　SCROLLBAR-HIGHLIGHT-COLOR: #DEEB9F;

　　SCROLLBAR-SHADOW-COLOR: #DEEB9F;

　　SCROLLBAR-3DLIGHT-COLOR:#DEEB9F;

　　SCROLLBAR-TRACK-COLOR: #FFFACD;

　　SCROLLBAR-ARROW-COLOR: #4A590D;

　　SCROLLBAR-DARKSHADOW-COLOR: #DEEB9F;

　　}

　　（COLOR:后面的颜色值视不同的模板而不同）

　　这里我们需要修改颜色代码值的属性有两处，一处是SCROLLBAR-FACE-COLOR，一处是SCROLLBAR-TRACK-COLOR，前者代表滚动条上下按钮上三角箭头的颜色和滑快的颜色，后者代表滚动条滑动槽的颜色，只用改这两个属性后面的颜色代码值为自己喜欢的颜色代码值即可。其它的属性后面的颜色代码值改变后用处不大，不过有兴趣的朋友可以改改试试，这里附上它们的属性说明：

　　scrollbar-darkshadow-color立体滚动条强阴影的颜色

　　scrollbar-highlight-color滚动条空白部分的颜色

　　scrollbar-shadowcolor立体滚动条阴影的颜色

　　scrollbar-3dlight-color立体滚动条亮边的颜色

　　scrollbar-arrow-color设置或检索滚动条方向箭头的颜色

　　另外有一个属性CSS代码中没有出现，顺便给大家说说，补一下课：

　　scrollbar-base-color滚动条的基本颜色

　　（2）修改在线留言和文章评论的滚动条的颜色。

　　默认情况下你的CSS代码表里面是没有在线留言和文章评论的滚动条的代码的，你需要手动添加。代码如下：

　　/*=====在线留言加滚动条======*/

　　div.guestBook{

　　overflow: auto;

　　font-family: Arial,Helvetica,sans-serif;

　　font-size: 9pt;

　　line-height: 18px;

　　color: #000000;

　　text-decoration: none;

　　height:250px;

　　SCROLLBAR-FACE-COLOR: #FFDDAA;

　　SCROLLBAR-HIGHLIGHT-COLOR: #DEEB9F;

　　SCROLLBAR-SHADOW-COLOR: #DEEB9F;

　　SCROLLBAR-3DLIGHT-COLOR:#DEEB9F;

　　SCROLLBAR-TRACK-COLOR: #FFFACD;

　　SCROLLBAR-ARROW-COLOR: #4A590D;

　　SCROLLBAR-DARKSHADOW-COLOR: #DEEB9F;}

　　/*=====评论加滚动条======*/

　　.operation#remark UL {

　　overflow: auto;

　　font-family: Arial,Helvetica,sans-serif;

　　font-size: 9pt;

　　line-height: 18px;

　　color: #000000;

　　text-decoration: none;

　　height:250px;

　　SCROLLBAR-FACE-COLOR: #FFDDAA;

　　SCROLLBAR-HIGHLIGHT-COLOR: #DEEB9F;

　　SCROLLBAR-SHADOW-COLOR: #DEEB9F;

　　SCROLLBAR-3DLIGHT-COLOR:#DEEB9F;

　　SCROLLBAR-TRACK-COLOR: #FFFACD;

　　SCROLLBAR-ARROW-COLOR: #4A590D;

　　SCROLLBAR-DARKSHADOW-COLOR: #DEEB9F;

　　}

　　和友情博客链接的改法一样，只需分别将SCROLLBAR-FACE-COLOR和SCROLLBAR-TRACK-COLOR这两处属性后面的颜色代码改成自己喜欢的颜色代码即可。

     （3）添加最新文章滚动条。直接在模板DIY，在CSS里加入下列代码。

     /*====最新文章滚动条====*/
#newWeblog.operation ul{
　　height:140px;
　　overflow: auto;
        scrollbar-face-color :  threedhighlight;（颜色可自选）
　　width: 195px;
　　text-align: left;
　　margin: 0px 0px 0px 5px;
　　padding: 0;
         }

　　附录1：

　　颜色代码表1，里面包含了各种颜色的代码和名称：

　　http://www.toodoo.com/db/color.html

　　颜色代码表2，同上：http://www.91qz.com/Article/Class6/Class8/200409/355.html

　　附录2：

　　颜色代码拾取器1，用来拾取颜色代码的工具，鼠标指到什么地方，它就显示什么地方的颜色代码，必备的好工具：http://www.herozhan.com/soft/2132.htm

　　颜色代码拾取器2，同上：http://www.msmir.net/Soft/down200/down1000/200505/700.html

【作者: 《流行歌曲》】【访问统计:】【2005年11月20日 星期日 18:16】【 加入博采】【打印】