スクロールバーのCSSでのデザイン変更まとめ
ChromeとIEでの設定だけわかったので、前回のを纏めます。
Firefoxでの設定方法が、全然分かりませんでした・・・。
それっぽいサイトを見つけてコピペしたけど、無反応・・・。
/*サイドバーのスクロールバー設定(Chromeのみ)*/
#box2-inner ::-webkit-scrollbar-track{
background: none; /* スクロールバーの背景色 */
}
#box2-inner ::-webkit-scrollbar{
width: 13px; /* スクロールバーの幅と高さ */
height: 10px;
}
#box2-inner ::-webkit-scrollbar-thumb{
background: #fafbfb; /* スクロールバーの色 */
border-radius: 10px; /* スクロールバーの角を丸くする*/
}
/*サイドバーのスクロールバー設定(IE専用で色指定しかできない)*/
#box2-inner {
scrollbar-arrow-color:#dce0e0; /* 矢印 */
scrollbar-face-color:#fafbfb; /* スクロールバー表面 */
scrollbar-3dlight-color:#dce0e0; /* ボタン外側の左と上の枠 */
scrollbar-darkshadow-color:#dce0e0; /* ボタン外側の右と下の枠 */
scrollbar-highlight-color:#dce0e0; /* ボタン内側の左と上の枠 */
scrollbar-shadow-color:#dce0e0; /* ボタン内側の右と下の枠 */
scrollbar-track-color:#7f8c8d; /* バーのない背景の部分 */
}