html滚动条样式

一、滚动条的轨迹，记作：scrollbar-track。所谓“轨迹”，指滚动条的滑动块运行时所必经的路线。 二、滚动条的滑动块，即在它上面按下鼠标左键不放可上下或左右移动的滑动块以及滚动条两头的小方块，记作：scrollbar-face。face即滚动条的“脸”，注意它有三张“脸”：滑动条和两头的小方块。
三、滚动条亮边框部分，记作：scrollbar-highlight。这个亮边框，和表格的亮边框概念是一样的，即左边和上边部分，滚动条的亮边框部分是指滚动条的“脸”（即滑动块和两头小方块）的亮边框。
四、滚动条亮边框部分的外围还有一个立体修饰部分，记作scrollbar-3dlight。3d即立体的意思，它将包围在滚动条亮边框部分的外边。
五、滚动条阴影部分，指主滑块和两头方块的阴影，位于左边和左下，记作：scrollbar-shadow。
六、滚动条阴影部分还有一个强阴影部分，记作scrollbar-darkshadow，它包围在阴影部分的外边。
七、滚动条两头方志标志箭头，记作：scrollbar-arrow，箭头方向为向下、向上、向左、向右。

 

<div id="center_down" style="overflow:auto; height:50; 
scrollbar-face-color: #f1f1f1; 
scrollbar-shadow-color: #ffffff; 
scrollbar-highlight-color:#ffffff; 
scrollbar-3dlight-color: #ffffff; 
scrollbar-darkshadow-color: #ffffff; 
scrollbar-track-color:#DDDDDD; 
scrollbar-arrow-color: #477ED1"> 
  <P align=left>文字内容</P>
  <P align=left>文字内容</P>
  <P align=left>文字内容</P>
  <P align=left>文字内容</P>
  <P align=left>文字内容</P>
  <P align=left>文字内容</P>
  <P align=left>文字内容</P>
  <P align=left>文字内容</P>
  <P align=left>文字内容</P>
  <P align=left>文字内容</P>
  <P align=left>文字内容</P>
  <P align=left>文字内容</P>
  <P align=left>文字内容</P>
  <P align=left>文字内容</P>
  <P align=left>文字内容</P>
  <P align=left>文字内容</P>
  <P align=left>文字内容</P>
  <P align=left>文字内容</P>
  <P align=left>文字内容</P>
  <P align=left>文字内容</P>
  <P align=left>文字内容</P>
  <P align=left>文字内容</P></div>