CSS设置div滚动条样式的示例
.scroll{
width:100px;
height:200px;
overflow:auto;/自動出現滾動條,如果要出現豎直滾動條則改成:overflow-y:auto,如果橫向出現滾動條則改成:overflow-x:auto/
scrollbar-face-color:#F00;/滾動條凸出部分的顏色(前景色),包括兩端的方形按鈕、水平或豎直滑動的滑塊的顏色/
scrollbar-track-color:#FFF;/滾動條的背景顏色,如果省略的話將出現虛點,顏色將采用face-color的顏色/
scrollbar-arrow-color:#FFF;/按鈕(上下或者左右可以點擊使滑塊滾動的方形按鈕)上三角箭頭的顏色/
scrollbar-3dlight-color:#0F0;/滾動條亮邊的顏色,形成3D效果,有層次感,肉眼觀察在滾動條左邊及上邊出現一條有色線(豎直方向滾動)/
scrollbar-darkshadow-color:#00F;/滾動條強陰影的顏色,肉眼觀察出現滾動條下邊及右邊/
scrollbar-highlight-color:#F0F;/滾動條空白部分的顏色,肉眼觀察改變不明顯,具體顏色改變出現在左邊和上邊空白處,介于face-color效果與3dlingt-color效果之間有個空白顏色(默認為白色)。此外,滾動條前景色有種凹陷的感覺,周邊線條顏色凸起/
scrollbar-shadow-color:#006600;/立體滾動條陰影的顏色,具體出現在滑塊及方形按鈕的右邊及下邊,形成陰影效果,顏色介于face-color效果和darkshadow-color效果之間,不是很明顯/
scrollbar-base-color:#0f0;/滾動條的基本顏色,當前面7個效果出現時,滾動條基本顏色設置肉眼很難觀察到,如果不設置前面7個效果,系統將根據base-color自動設置,其中前景色,背景色(虛點表示)顏色一致,其他效果(陰影以黑色填充),沒有什么要求時,建議不設置此效果/
/*
scrollbar-face-color:#F00;
scrollbar-track-color:#FFF;
scrollbar-arrow-color:#FFF;
這3個效果建議必須設置
*/
}
.font{ color:#006600}
文字內容
文字內容
文字內容
文字內容
文字內容
文字內容
文字內容
文字內容
文字內容
文字內容
文字內容
文字內容
文字內容
文字內容
總結
以上是生活随笔為你收集整理的CSS设置div滚动条样式的示例的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: Android FTP客户端使用,快速上
- 下一篇: 大学物理实验 | 直流电桥