7.

代碼：

<div style="BORDER-RIGHT: 1px solid; BORDER-TOP: 1px solid; OVERFLOW: auto; BORDER-LEFT: 1px solid; WIDTH: 300px; DIRECTION: rtl; BORDER-BOTTOM: 1px solid; HEIGHT: 100px;">

<p align=left>文字</p></DIV>

6.

代碼：

<div style="BORDER-RIGHT: #ff9999 2px solid; BORDER-TOP: #ff9999 2px solid; SCROLLBAR-FACE-COLOR: #ffccff; SCROLLBAR-HIGHLIGHT-COLOR: #ff99cc; OVERFLOW: scroll; BORDER-LEFT: #ff9999 2px solid; WIDTH: 300px; SCROLLBAR-SHADOW-COLOR: #ff99cc; COLOR: #ff00ff; SCROLLBAR-3DLIGHT-COLOR: #ffcccc; SCROLLBAR-ARROW-COLOR: #ff99cc; BORDER-BOTTOM: #ff9999 2px solid; SCROLLBAR-DARKSHADOW-COLOR: #ffccff; HEIGHT: 200px; BACKGROUND-COLOR: #ffccff">

<p align=left>文字</p></DIV>

5.

代碼：

<div style="BORDER-RIGHT: #ff9999 2px solid; BORDER-TOP: #ff9999 2px solid; SCROLLBAR-FACE-COLOR: #ffcccc; SCROLLBAR-HIGHLIGHT-COLOR: #ff9999; OVERFLOW: scroll; BORDER-LEFT: #ff9999 2px solid; WIDTH: 300px; SCROLLBAR-SHADOW-COLOR: #ff9999; COLOR: #ff6699; SCROLLBAR-3DLIGHT-COLOR: #ffcccc; SCROLLBAR-ARROW-COLOR: #ffcccc; BORDER-BOTTOM: #ff9999 2px solid; SCROLLBAR-DARKSHADOW-COLOR: #ffcc99; HEIGHT: 200px; BACKGROUND-COLOR: #ffcccc">

<p align=left>文字</p></DIV>

4.

代碼：

<div style="SCROLLBAR-FACE-COLOR: #ff6600; SCROLLBAR-HIGHLIGHT-COLOR: #c3d6da; OVERFLOW: scroll; WIDTH: 300px; SCROLLBAR-SHADOW-COLOR: #663333; COLOR: #ffffff; SCROLLBAR-ARROW-COLOR: #663333; HEIGHT: 200px; BACKGROUND-COLOR: #000000; SCROLLBAR-3DLIGHT-: #663333">

<p align=left>文字</p></DIV>

3.

代碼：

<DIV style="BORDER-RIGHT: #ff9999 2px solid; BORDER-TOP: #ff9999 2px solid; SCROLLBAR-FACE-COLOR: #ffcc99; SCROLLBAR-HIGHLIGHT-COLOR: #ff9966; OVERFLOW: scroll; BORDER-LEFT: #ff9999 2px solid; WIDTH: 300px; SCROLLBAR-SHADOW-COLOR: #ff9966; COLOR: #ff3300; SCROLLBAR-3DLIGHT-COLOR: #ffcc99; SCROLLBAR-ARROW-COLOR: #ff9966; BORDER-BOTTOM: #ff9999 2px solid; SCROLLBAR-DARKSHADOW-COLOR: #ffcc99; HEIGHT: 200px; BACKGROUND-COLOR: #ffcc99" >

<p align=left>文字</p></DIV>

2.

代碼：

<DIV style="BORDER-RIGHT: black 2px solid; BORDER-TOP: black 2px solid; SCROLLBAR-FACE-COLOR: #889b9f; SCROLLBAR-HIGHLIGHT-COLOR: #c3d6da; OVERFLOW: scroll; BORDER-LEFT: black 2px solid; WIDTH: 300px; SCROLLBAR-SHADOW-COLOR: #3d5054; COLOR: #ffffff; SCROLLBAR-3DLIGHT-COLOR: #3d5054; SCROLLBAR-ARROW-COLOR: #ffd6da; BORDER-BOTTOM: black 2px solid; SCROLLBAR-DARKSHADOW-COLOR: #85989c; HEIGHT: 200px; BACKGROUND-COLOR: #000000" >

<P align=left>文字</P></DIV>

1.

代碼：

<DIV style="BORDER-RIGHT: black 2px solid; BORDER-TOP: black 2px solid; SCROLLBAR-FACE-COLOR: #000000; SCROLLBAR-HIGHLIGHT-COLOR: #000000; OVERFLOW: auto; BORDER-LEFT: black 2px solid; WIDTH: 300px; SCROLLBAR-SHADOW-COLOR: #ffffff; COLOR: #ff9900; SCROLLBAR-3DLIGHT-COLOR: #3d5054; SCROLLBAR-ARROW-COLOR: #ffd6da; BORDER-BOTTOM: black 2px solid; SCROLLBAR-DARKSHADOW-COLOR: #000000; HEIGHT: 200px; BACKGROUND-COLOR: #000000">

<P align=left>文字</P></DIV>

轉載于:https://www.cnblogs.com/walle2014/p/3660057.html

總結

以上是生活随笔為你收集整理的几种比较好看的滚动条样式及代码的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。