一目了然：IE、Chrome滚动条样式设置详解(附：IE滚动条样式生成工具）

自定义IE滚动条样式：

样式仅用于IE浏览器，其它浏览器下无效。

用法：

IE5.5+滚动条样式使用示例

例子：

<sytle>
/* 000的背景，FFF的滚动条，只需要两个色值 */
div.content {
	scrollbar-track-color: #000;
	scrollbar-3dlight-color: #000;
	scrollbar-darkshadow-color: #000;
	scrollbar-arrow-color: #000;
	scrollbar-face-color: #FFF;
	scrollbar-highlight-color: #FFF;
	scrollbar-shadow-color: #FFF;
}
</style>

下载：

IE滚动条颜色生成器.CHM

自定义Google Chrome滚动条样式：

GC可以通过伪类来定义滚动条的样式。

效果预览：

Chrome滚动条样式示例

用法：

Chrome定义滚动条样式的伪类

效果预览部分的代码：

<style>
::-webkit-scrollbar-track-piece{
	background-color:#CCC;
	-webkit-border-radius:0;
}
::-webkit-scrollbar{
	width:10px;
}
::-webkit-scrollbar-thumb{
	background-color:#999;
	border:solid 1px #333;
	border-radius:4px;
}
::-webkit-scrollbar-thumb:hover{
	background-color:#999;
}
::-webkit-scrollbar-arrow {
	color:#F00;
	backgound:#0F0;
}
</style>
<p>p</p><p>p</p><p>p</p><p>p</p>
<p>p</p><p>p</p><p>p</p><p>p</p>

＜完＞