效果图：见附
代码：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>div滚动条样式</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
<table style="BORDER-COLLAPSE: collapse" bordercolor="#c0c0c0" cellspacing="0" cellpadding="0" width="600" border="1">
<tbody>
<tr>
<td width="180" height="140">
<div style="SCROLLBAR-FACE-COLOR: #70807d; SCROLLBAR-HIGHLIGHT-COLOR: #ffffff; OVERFLOW: scroll; WIDTH: 180px; SCROLLBAR-SHADOW-COLOR: #ffffff; SCROLLBAR-3DLIGHT-COLOR: #70807d; SCROLLBAR-ARROW-COLOR: #ffffff; SCROLLBAR-TRACK-COLOR: #ffffff; SCROLLBAR-DARKSHADOW-COLOR: #70807d; HEIGHT: 140px; p: left><FONT style=" face="Arial"><font color="#99cc00"><div style="WIDTH: 120; HEIGHT: 140; BACKGROUND-COLOR: #0000C6; OVERFLOW: scroll; scrollbar-face-color:#70807d; scrollbar-arrow-color:#ffffff; scrollbar-highlight-color:#ffffff; scrollbar-3dlight-color:#70807d; scrollbar-shadow-color:#ffffff; scrollbar-darkshadow-color:#70807d; scrollbar-track-color:#ffffff"><br />
文字内容<br />
</div></font></div>
</td>
<td width="180" height="140">
<div style="SCROLLBAR-FACE-COLOR: #ffffff; SCROLLBAR-HIGHLIGHT-COLOR: #ffffff; OVERFLOW: scroll; WIDTH: 180px; SCROLLBAR-3DLIGHT-COLOR: #f2f2f2; SCROLLBAR-ARROW-COLOR: #9999cc; SCROLLBAR-TRACK-COLOR: #ffffff; SCROLLBAR-DARKSHADOW-COLOR: #f2f2f2; HEIGHT: 140px; p: left><FONT style=" face="Arial"><font color="#99cc00"><div style="WIDTH: 120; HEIGHT: 140; OVERFLOW: scroll; scrollbar-3dlight-color:#FF0033; scrollbar-arrow-color:#FFFFFF; scrollbar-track-color:#FFFF33; scrollbar-darkshadow-color:#FFFF33; scrollbar-face-color:#FF0033; scrollbar-highlight-color:#FFFFFF; scrollbar-shadow-color:#FF0033"><br />
文字内容<br />
</div></font></div>
</td>
<td width="180" height="140">
<div style="SCROLLBAR-FACE-COLOR: #ff0033; SCROLLBAR-HIGHLIGHT-COLOR: #ffffff; OVERFLOW: scroll; WIDTH: 180px; SCROLLBAR-SHADOW-COLOR: #ff0033; SCROLLBAR-3DLIGHT-COLOR: #ff0033; SCROLLBAR-ARROW-COLOR: #ffffff; SCROLLBAR-TRACK-COLOR: #ffff33; SCROLLBAR-DARKSHADOW-COLOR: #ffff33; HEIGHT: 140px; p: left><FONT style=" face="Arial"><font color="#99cc00"><div style="WIDTH: 120; HEIGHT: 140; OVERFLOW: scroll; scrollbar-3dlight-color:#FF0033; scrollbar-arrow-color:#FFFFFF; scrollbar-track-color:#FFFF33; scrollbar-darkshadow-color:#FFFF33; scrollbar-face-color:#FF0033; scrollbar-highlight-color:#FFFFFF; scrollbar-shadow-color:#FF0033"><br />
文字内容<br />
</div></font></div>
</td>
<td width="180" height="140">
<div style="SCROLLBAR-FACE-COLOR: #eaecec; SCROLLBAR-HIGHLIGHT-COLOR: #eaecec; OVERFLOW: scroll; WIDTH: 180px; SCROLLBAR-SHADOW-COLOR: black; SCROLLBAR-3DLIGHT-COLOR: #eaecec; SCROLLBAR-ARROW-COLOR: #eaecec; SCROLLBAR-TRACK-COLOR: #ffffff; SCROLLBAR-DARKSHADOW-COLOR: #eaecec; HEIGHT: 140px; p: left><FONT style=" face="Arial"><font color="#99cc00"><div style="WIDTH: 120; HEIGHT: 140; OVERFLOW: scroll; SCROLLBAR-FACE-COLOR: EAECEC; SCROLLBAR-HIGHLIGHT-COLOR: EAECEC; SCROLLBAR-SHADOW-COLOR: BLACK; SCROLLBAR-3DLIGHT-COLOR: EAECEC; SCROLLBAR-ARROW-COLOR: EAECEC; SCROLLBAR-TRACK-COLOR: FFFFFF; SCROLLBAR-DARKSHADOW-COLOR: EAECEC"><br />
文字内容<br />
</div></font></div>
</td>
</tr>
<tr>
<td width="180" height="140">
<div style="SCROLLBAR-FACE-COLOR: #cfcfcf; SCROLLBAR-HIGHLIGHT-COLOR: #ffffff; OVERFLOW: scroll; WIDTH: 180px; SCROLLBAR-SHADOW-COLOR: #595959; SCROLLBAR-3DLIGHT-COLOR: #595959; SCROLLBAR-ARROW-COLOR: #ffffff; SCROLLBAR-DARKSHADOW-COLOR: #ffffff; SCROLLBAR-BASE-COLOR: #cfcfcf; HEIGHT: 140px">
<p align="left"><font style="FONT-SIZE: 9pt" face="Arial" color="#99cc00"><div style="WIDTH: 120; HEIGHT: 140;OVERFLOW: scroll; scrollbar-3dlight-color:#595959; scrollbar-arrow-color:#FFFFFF; scrollbar-base-color:#CFCFCF; scrollbar-darkshadow-color:#FFFFFF; scrollbar-face-color:#CFCFCF; scrollbar-highlight-color:#FFFFFF; scrollbar-shadow-color:#595959"><br />
文字内容<br />
</div></font></p>
</div>
</td>
<td width="180" height="140">
<div style="SCROLLBAR-FACE-COLOR: #ffffff; SCROLLBAR-HIGHLIGHT-COLOR: #d2e5f4; OVERFLOW: scroll; WIDTH: 180px; SCROLLBAR-SHADOW-COLOR: #d2e5f4; SCROLLBAR-3DLIGHT-COLOR: #ffffff; SCROLLBAR-ARROW-COLOR: #d2e5f4; SCROLLBAR-TRACK-COLOR: #ffffff; SCROLLBAR-DARKSHADOW-COLOR: #ffffff; HEIGHT: 140px; p: left><FONT style=" face="Arial"><font color="#99cc00"><div style="WIDTH: 120; HEIGHT: 140; OVERFLOW: scroll; scrollbar-face-color: #FFFFFF; scrollbar-shadow-color: #D2E5F4; scrollbar-highlight-color: #D2E5F4; scrollbar-3dlight-color: #FFFFFF; scrollbar-darkshadow-color: #FFFFFF; scrollbar-track-color: #FFFFFF; scrollbar-arrow-color: #D2E5F4"><br />
文字内容<br />
</div></font></div>
</td>
<td width="180" height="140">
<div style="SCROLLBAR-FACE-COLOR: #d9d9d9; SCROLLBAR-HIGHLIGHT-COLOR: #ffffff; OVERFLOW: scroll; WIDTH: 180px; SCROLLBAR-SHADOW-COLOR: #ffffff; SCROLLBAR-3DLIGHT-COLOR: #d9d9d9; SCROLLBAR-ARROW-COLOR: #ffffff; SCROLLBAR-TRACK-COLOR: #ffffff; SCROLLBAR-DARKSHADOW-COLOR: #d9d9d9; HEIGHT: 140px; p: left><FONT style=" face="Arial"><font color="#99cc00"><div style="WIDTH: 120; HEIGHT: 140; OVERFLOW: scroll; scrollbar-shadow-color: #ffffff; scrollbar-highlight-color: #ffffff; scrollbar-face-color: #d9d9d9; scrollbar-3dlight-color: #d9d9d9; scrollbar-darkshadow-color: #d9d9d9; scrollbar-track-color: #ffffff; scrollbar-arrow-color: #ffffff"><br />
文字内容<br />
</div></font></div>
</td>
<td width="180" height="140">
<div style="SCROLLBAR-FACE-COLOR: #59adbb; SCROLLBAR-HIGHLIGHT-COLOR: #ffffff; OVERFLOW: scroll; WIDTH: 180px; SCROLLBAR-SHADOW-COLOR: #ffffff; SCROLLBAR-3DLIGHT-COLOR: #59adbb; SCROLLBAR-ARROW-COLOR: #ffffff; SCROLLBAR-TRACK-COLOR: #ffffff; SCROLLBAR-DARKSHADOW-COLOR: #59adbb; HEIGHT: 140px; p: left><FONT style=" face="Arial"><font color="#99cc00"><div style="WIDTH: 120; HEIGHT: 140; OVERFLOW: scroll; scrollbar-shadow-color: #FFFFFF; scrollbar-highlight-color: #FFFFFF; scrollbar-arrow-color: #FFFFFF; scrollbar-face-color: #59ADBB; scrollbar-track-color: #FFFFFF; scrollbar-3dlight-color: #59ADBB; scrollbar-darkshadow-color: #59ADBB"><br />
文字内容<br />
</div></font></div>
</td>
</tr>
<tr>
<td width="180" height="140">
<div style="SCROLLBAR-FACE-COLOR: #ffffff; SCROLLBAR-HIGHLIGHT-COLOR: #ffffff; OVERFLOW: scroll; WIDTH: 180px; SCROLLBAR-SHADOW-COLOR: #ffc300; SCROLLBAR-3DLIGHT-COLOR: #ffc300; SCROLLBAR-ARROW-COLOR: #ffc300; SCROLLBAR-TRACK-COLOR: #ffffff; SCROLLBAR-DARKSHADOW-COLOR: #ffffff; HEIGHT: 140px; p: left><FONT style=" face="Arial"><font color="#99cc00"><div style="WIDTH: 120; HEIGHT: 140; OVERFLOW: scroll; scrollbar-face-color: #FFFFFF; scrollbar-shadow-color: #FFC300; scrollbar-highlight-color: #FFFFFF; scrollbar-3dlight-color: #FFC300; scrollbar-darkshadow-color: #FFFFFF; scrollbar-track-color: #FFFFFF; scrollbar-arrow-color: #FFC300"><br />
文字内容<br />
</div></font></div>
</td>
<td width="180" height="140">
<div style="SCROLLBAR-FACE-COLOR: #ddd38d; SCROLLBAR-HIGHLIGHT-COLOR: #fff8c5; OVERFLOW: scroll; WIDTH: 180px; SCROLLBAR-SHADOW-COLOR: #5a5227; SCROLLBAR-3DLIGHT-COLOR: #5a5227; SCROLLBAR-ARROW-COLOR: #fff8c5; SCROLLBAR-DARKSHADOW-COLOR: #fff8c5; SCROLLBAR-BASE-COLOR: #ddd38d; HEIGHT: 140px; p: left><FONT style=" face="Arial"><font color="#99cc00"><div style="WIDTH: 120; HEIGHT: 140; OVERFLOW: scroll; scrollbar-3dlight-color:5A5227; scrollbar-arrow-color:FFF8C5; scrollbar-base-color:DDD38D; scrollbar-darkshadow-color:FFF8C5; scrollbar-face-color:DDD38D; scrollbar-highlight-color:FFF8C5; scrollbar-shadow-color:5A5227"><br />
文字内容<br />
</div></font></div>
</td>
<td width="180" height="140">
<div style="SCROLLBAR-FACE-COLOR: #9ebfe8; SCROLLBAR-HIGHLIGHT-COLOR: #ffffff; OVERFLOW: scroll; WIDTH: 180px; SCROLLBAR-SHADOW-COLOR: #ffffff; SCROLLBAR-3DLIGHT-COLOR: #9ebfe8; SCROLLBAR-ARROW-COLOR: #ffffff; SCROLLBAR-TRACK-COLOR: #ffffff; SCROLLBAR-DARKSHADOW-COLOR: #9ebfe8; HEIGHT: 140px; p: left><FONT style=" face="Arial"><font color="#99cc00"><div style="WIDTH: 120; HEIGHT: 140; OVERFLOW: scroll; scrollbar-face-color: #9EBFE8; scrollbar-shadow-color: #FFFFFF; scrollbar-highlight-color: #FFFFFF; scrollbar-3dlight-color: #9EBFE8; scrollbar-darkshadow-color: #9EBFE8; scrollbar-track-color: #FFFFFF; scrollbar-arrow-color: #FFFFFF"><br />
文字内容<br />
</div></font></div>
</td>
<td width="180" height="140">
<div style="SCROLLBAR-FACE-COLOR: #db52bc; SCROLLBAR-HIGHLIGHT-COLOR: #e994d6; OVERFLOW: scroll; WIDTH: 180px; SCROLLBAR-SHADOW-COLOR: #e994d6; SCROLLBAR-3DLIGHT-COLOR: #db52bc; SCROLLBAR-ARROW-COLOR: #ffffff; SCROLLBAR-TRACK-COLOR: #e994d6; SCROLLBAR-DARKSHADOW-COLOR: #db52bc; HEIGHT: 140px; p: left><FONT style=" face="Arial"><font color="#99cc00"><div style="WIDTH: 120; HEIGHT: 140; OVERFLOW: scroll; scrollbar-face-color: #DB52BC; scrollbar-shadow-color: #E994D6; scrollbar-highlight-color: #E994D6; scrollbar-3dlight-color: #DB52BC; scrollbar-darkshadow-color: #DB52BC; scrollbar-track-color: #E994D6; scrollbar-arrow-color: #FFFFFF"><br />
文字内容<br />
</div></font></div>
</td>
</tr>
<tr>
<td width="180" height="140">
<div style="SCROLLBAR-FACE-COLOR: #333333; SCROLLBAR-HIGHLIGHT-COLOR: #666666; OVERFLOW: scroll; WIDTH: 180px; SCROLLBAR-SHADOW-COLOR: #333333; SCROLLBAR-3DLIGHT-COLOR: #101010; SCROLLBAR-ARROW-COLOR: #000000; SCROLLBAR-TRACK-COLOR: #101010; SCROLLBAR-DARKSHADOW-COLOR: #070707; HEIGHT: 140px; p: left><FONT style=" face="Arial"><font color="#99cc00"><div style="WIDTH: 120; HEIGHT: 140; OVERFLOW: scroll; scrollbar-face-color: #333333; scrollbar-shadow-color: #333333; scrollbar-highlight-color: #666666; scrollbar-3dlight-color: #101010; scrollbar-darkshadow-color: #070707; scrollbar-track-color: #101010; scrollbar-arrow-color: #000000"><br />
文字内容<br />
</div></font></div>
</td>
<td width="180" height="140">
<div style="SCROLLBAR-FACE-COLOR: #333333; SCROLLBAR-HIGHLIGHT-COLOR: #333333; OVERFLOW: scroll; WIDTH: 180px; SCROLLBAR-SHADOW-COLOR: #808080; SCROLLBAR-3DLIGHT-COLOR: #808080; SCROLLBAR-ARROW-COLOR: #cccccc; SCROLLBAR-TRACK-COLOR: #191919; SCROLLBAR-DARKSHADOW-COLOR: #333333; HEIGHT: 140px; p: left><FONT style=" face="Arial"><font color="#99cc00"><div style="WIDTH: 120; HEIGHT: 140; OVERFLOW: scroll; scrollbar-face-color: #333333; scrollbar-shadow-color: #808080; scrollbar-highlight-color: #333333; scrollbar-3dlight-color: #808080; scrollbar-darkshadow-color: #333333; scrollbar-track-color: #191919; scrollbar-arrow-color: #CCCCCC"><br />
文字内容<br />
</div></font></div>
</td>
<td width="180" height="140">
<div style="SCROLLBAR-FACE-COLOR: #ffc4e1; SCROLLBAR-HIGHLIGHT-COLOR: #ffffff; OVERFLOW: scroll; WIDTH: 180px; SCROLLBAR-SHADOW-COLOR: #ff6ab5; SCROLLBAR-3DLIGHT-COLOR: #ff95ca; SCROLLBAR-ARROW-COLOR: #ffffff; SCROLLBAR-TRACK-COLOR: #ffddee; SCROLLBAR-DARKSHADOW-COLOR: #ffb5da; HEIGHT: 140px; p: left><FONT style=" face="Arial"><font color="#99cc00"><div style="WIDTH: 120; HEIGHT: 140; OVERFLOW: scroll; scrollbar-face-color:#FFC4E1; scrollbar-highlight-color:#FFFFFF; scrollbar-3dlight-color:#FF95CA; scrollbar-darkshadow-color:#FFB5DA; scrollbar-shadow-color:#FF6AB5; scrollbar-arrow-color:#FFFFFF; scrollbar-track-color:#FFDDEE"><br />
文字内容<br />
</div></font></div>
</td>
<td width="180" height="140">
<div style="SCROLLBAR-FACE-COLOR: #dbebfe; SCROLLBAR-HIGHLIGHT-COLOR: #ffffff; OVERFLOW: scroll; WIDTH: 180px; SCROLLBAR-SHADOW-COLOR: #b8d6fa; SCROLLBAR-3DLIGHT-COLOR: #dbebfe; SCROLLBAR-ARROW-COLOR: #458ce4; SCROLLBAR-TRACK-COLOR: #ffffff; SCROLLBAR-DARKSHADOW-COLOR: #458ce4; HEIGHT: 140px; p: left><FONT style=" face="Arial"><font color="#99cc00"><div style="WIDTH: 120; HEIGHT: 140; OVERFLOW: scroll; scrollbar-face-color: #DBEBFE; scrollbar-shadow-color: #B8D6FA; scrollbar-highlight-color: #FFFFFF; scrollbar-3dlight-color: #DBEBFE; scrollbar-darkshadow-color:#458CE4; scrollbar-track-color: #FFFFFF; scrollbar-arrow-color: #458CE4"><br />
文字内容<br />
</div></font></div>
</td>
</tr>
<tr>
<td width="180" height="140">
<div style="SCROLLBAR-FACE-COLOR: #ffffff; SCROLLBAR-HIGHLIGHT-COLOR: #f8ecd8; OVERFLOW: scroll; WIDTH: 180px; SCROLLBAR-SHADOW-COLOR: #885c10; SCROLLBAR-3DLIGHT-COLOR: #885c10; SCROLLBAR-ARROW-COLOR: #885c10; SCROLLBAR-TRACK-COLOR: #f8ecd8; SCROLLBAR-DARKSHADOW-COLOR: #f8ecd8; HEIGHT: 140px; p: left><FONT style=" face="Arial"><font color="#99cc00"><div style="WIDTH: 120; HEIGHT: 140; OVERFLOW: scroll; scrollbar-face-color: #FFFFFF; scrollbar-shadow-color: #885C10; scrollbar-highlight-color: #F8ECD8; scrollbar-3dlight-color: #885C10; scrollbar-darkshadow-color: #F8ECD8; scrollbar-track-color: #F8ECD8; scrollbar-arrow-color: #885C10"><br />
文字内容<br />
</div></font></div>
</td>
<td width="180" height="140">
<div style="SCROLLBAR-FACE-COLOR: #222222; SCROLLBAR-HIGHLIGHT-COLOR: #ffffff; OVERFLOW: scroll; WIDTH: 180px; SCROLLBAR-SHADOW-COLOR: #ffffff; SCROLLBAR-3DLIGHT-COLOR: #222222; SCROLLBAR-ARROW-COLOR: #222222; SCROLLBAR-TRACK-COLOR: #222222; SCROLLBAR-DARKSHADOW-COLOR: #222222; HEIGHT: 140px; p: left><FONT style=" face="Arial"><font color="#99cc00"><div style="WIDTH: 120; HEIGHT: 140; OVERFLOW: scroll; scrollbar-face-color: #222222; scrollbar-highlight-color: #FFFFFF; scrollbar-3dlight-color: #222222; scrollbar-shadow-color: #FFFFFF; scrollbar-darkshadow-color: #222222; scrollbar-track-color: #222222; scrollbar-arrow-color: #222222"><br />
文字内容<br />
</div></font></div>
</td>
<td width="180" height="140">
<div style="SCROLLBAR-FACE-COLOR: #fddee8; SCROLLBAR-HIGHLIGHT-COLOR: #ffffff; OVERFLOW: scroll; WIDTH: 180px; SCROLLBAR-SHADOW-COLOR: #fddee8; SCROLLBAR-3DLIGHT-COLOR: #fdcfdd; SCROLLBAR-ARROW-COLOR: #fea6c0; SCROLLBAR-TRACK-COLOR: #fff6f9; SCROLLBAR-DARKSHADOW-COLOR: #fdcfdd; HEIGHT: 140px; p: left><FONT style=" face="Arial"><font color="#99cc00"><div style="WIDTH: 120; HEIGHT: 140; OVERFLOW: scroll; scrollbar-face-color: #FDDEE8; scrollbar-shadow-color: #FDDEE8; scrollbar-highlight-color: #ffffff; scrollbar-3dlight-color: #FDCFDD; scrollbar-darkshadow-color: #FDCFDD; scrollbar-track-color: FFF6F9; scrollbar-arrow-color: #FEA6C0"><br />
文字内容<br />
</div></font></div>
</td>
</tr>
</tbody>
</table>
</div>
</td>
</tr>
</tbody>
</table> </body>
</html>
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
