山水天下

1．overflow内容溢出时的设置（设定被设定对象是否显示滚动条）
overflow-x水平方向内容溢出时的设置
overflow-y垂直方向内容溢出时的设置
以上三个属性设置的值为visible(默认值)、scroll、hidden、auto。

2．scrollbar-3d-light-color立体滚动条亮边的颜色（设置滚动条的颜色）
scrollbar-arrow-color上下按钮上三角箭头的颜色
scrollbar-base-color滚动条的基本颜色
scrollbar-dark-shadow-color立体滚动条强阴影的颜色
scrollbar-face-color立体滚动条凸出部分的颜色
scrollbar-highlight-color滚动条空白部分的颜色
scrollbar-shadow-color立体滚动条阴影的颜色

我们通过几个实例来讲解上述的样式属性：
1.让浏览器窗口永远都不出现滚动条
没有水平滚动条

没有垂直滚动条

没有滚动条
或style="overflow:hidden">

2.设定多行文本框的滚动条

没有水平滚动条
<br /><br />没有垂直滚动条<br /><textarea style="OVERFLOW-Y: hidden" /><br /><br />没有滚动条<br /><textarea style="OVERFLOW-Y: hidden; OVERFLOW-X: hidden" /><br />或<textarea style="OVERFLOW: hidden" /><br /><br />3.设定窗口滚动条的颜色<br />设置窗口滚动条的颜色为红色<br />scrollbar-base-color设定的是基本色，一般情况下只需要设置这一个属性就可以达到改变滚动条颜色的目的。<br />加上一点特别的效果：<br /><br /><br />4.在样式表文件中定义好一个类，调用样式表。<br /><style></style><br />这样调用：<br /><textarea class="coolscrollbar" /></p> <BR><BR><BR></div><DIV style="FONT-SIZE: 12px; COLOR: #003388; LINE-HEIGHT: 180%; FONT-FAMILY: 宋体" align=right>(来源：网络 编辑：邻居) </DIV> </p> <p class="diaryFoot">【作者: <a href="javascript:void(0);" onClick="window.open('http://publishblog.blogchina.com/blog/postMessage.b?receiver=435938','发送短消息','width=520, height=455')">邻居</a>】【访问统计:<script language="JavaScript" src="http://counter.blogchina.com/PageServlet?pageid=3472970&blogid=436462"></script>】【2005年11月9日 星期三 22:17】【 <a href="javascript:void(keyit=window.open('http://blogmark.blogchina.com/jsp/key/quickaddkey.jsp?k='+encodeURI('细说滚动条')+'&u='+encodeURI('http://myok.blogchina.com/myok/3472970.html')+'&c='+encodeURI(''),'keyit','scrollbars=no,width=500,height=430,status=no,resizable=yes'));keyit.focus();">加入博采</a>】【<a href="javascript:window.print();" >打印</a>】 </td> </p> </div> <div class="operation"> <a name="trackback"><H3>Trackback</H3></a> <p class="trackback">你可以使用这个链接引用该篇文章 http://publishblog.blogchina.com/blog/tb.b?diaryID=3472970 </p> </div> <div class="operation"> <a name="relatedDiary"><H3>博客手拉手</H3></a> <table> <tr> <td align="left"><a href="http://ssjlbyw.blogchina.com/3431877.html" target="_blank" title="将滚动条的颜色修改成自己喜欢的颜色 [转贴]">将滚动条的颜色修改成自己喜欢的颜色 [转贴]</a></td> </tr> <tr> <td align="left"><a href="http://eleu997.blogchina.com/3448970.html" target="_blank" title="好玩的东东跟大家分享">好玩的东东跟大家分享</a></td> </tr> <tr> <td align="left"><a href="http://myok.blogchina.com/3414042.html" target="_blank" title="Iframe 用法的详细讲解">Iframe 用法的详细讲解</a></td> </tr> <tr> <td align="left"><a href="http://tanzhijun.blogchina.com/3469122.html" target="_blank" title="满汉全席大菜单">满汉全席大菜单</a></td> </tr> <tr> <td align="left"><a href="http://wolfware.blogchina.com/3380332.html" target="_blank" title="javascript事件集锦">javascript事件集锦</a></td> </tr> </table> </div> <div class="operation"> <a name="comment"><H3>回复</H3></a> <table width="700" border="0" cellpadding="0" cellspacing="0"> <tr align="left"> <td rowspan="2" align="center"> </td> <td colspan="4"><H4><a name="comment$(remark.remarkID)"> - 评论人：jiaozhu</a> <span>  2006-05-31 09:10:19 <a > <img src="http://blog.bokee.com/img/linkblog.jpg" border="0" > </a>　 </span></H4> </td> </tr> <tr align="left"> <td colspan="4" valign="top"><P class="comment">你好<br> </P></td> </tr> <tr align="left"> <td rowspan="2" align="center"> </td> <td colspan="4"><H4><a name="comment$(remark.remarkID)"> - 评论人：欧洲自由行</a> <span>  2005-12-28 11:39:10 <a > <img src="http://blog.bokee.com/img/linkblog.jpg" border="0" > </a>　 </span></H4> </td> </tr> <tr align="left"> <td colspan="4" valign="top"><P class="comment">实用！ <br>欧洲自由行 放飞你心灵 <br>(http://gaozy.anyp.cn)<br> </P></td> </tr> </table> </div> <div class="operation"> <table width="700" border="0" cellpadding="0" cellspacing="0" class="comment"> <form id="replyForm" method="POST"> <input type="hidden" name="blogID" value="436462"> <input type="hidden" name="diaryID" value="3472970"> <input type="hidden" name="blogDomino" value="myok"> <script> if(getCookie('userID') == null){ document.write('<tr><td width="70">发布人：</td>'); document.write('<td width="150"> <input name="remark.authorNameFUI" type="text" size="20" class="inputStyle" maxlength="20"></td>'); document.write('<td width="70">邮箱：</td>'); document.write('<td width="435"> <input name="remark.authorEmail" type="text" size="20" class="inputStyle" maxlength="40"></td>'); document.write('</tr><tr><td>主　页：</td>'); document.write('<td colspan="3"> <input name="remark.authorURL" type="text" class="inputStyle" value="HTTP://" size="63" maxlength="100"></td></tr>'); }else{ document.write('<input type="hidden" name="remark.authorNameFUI" value="Blogchina网友">'); } </script> <tr> <td width="70">验证码：</td> <td><input name="validateCode" type="text" class="inputStyle" maxlength="4" size="20"></td><td>  <img src="http://publishblog.blogchina.com/servlet/getValidateImg" border="0"></td> </tr> <tr align="left"> <td colspan="4">评论内容：<br/> <textarea name="remark.remarkFUI" id="remark" cols="60" rows="8" class="textStyle" >