6-1 スクロールバーの色変更
基本的にIEでのみ有効です。
- IE でも 7.0 以降、HTMLの文章宣言によっては色を指定していても見る事が出来ません。
- NNとFireFoxでは色の表示は致しません。
（Firefox 3.0 では 『エラーコンソール』 という項目において、「不明なプロパティ ' scrollbar-face-color ' が使用されています。このスタイル宣言は無視されました」というメッセージが残されております） - OPERAの場合
OPERA7.5 ではユーザーが「スクロールバーのスタイルを有効にする」という項目にチェックを入れていない限り、こちらも表示はされません。（この項目はダウンロードしたばかりの段階ではオフになっております）また、このスタイルを有効にしていても、HTMLの文章宣言によっては色を指定していても見る事が出来ません。
動作は全てWinのIE6.0、NN7.1、OPERA7.5、Firefox1.5.0.1で確認済みです。
<head> ～ </head> 内に記述して下さい。
<style type="text/css">
<!--
body {
scrollbar-face-color:#990066; /* 本体の色 */
scrollbar-track-color:#990066;/* 背面の色 */
scrollbar-arrow-color:#ffffff; /* 矢印の色 */
scrollbar-highlight-color:#ffffff; /* 左側（上） */
scrollbar-shadow-color:#ffffff; /* 右側（下） */
scrollbar-3dlight-color:#990066; /* 左側（外上）*/
scrollbar-darkshadow-color:#990066; /* 右側（外下） */
}
-->
</style>
これはすぐ右側にある当サイトのスクロールバーの色指定です（→）
[ 関連事項 ： HP-TIPS > CSS > 外部スタイルシートの記述方法 ]
6-2 スクロールバーの見本
※ 「scrollbar-track-color:」というタグの「track」部分を
「base」に変更すると背面部分の色がベタ塗りではなくてドット調に変わります。
- （但し必ず「highlight-color」と「base-color」の色合いを変えて下さい。 「highlight-color」の色が下地になり「base-color」で指定した色がドットになります。）
- 左記の物（←）はドット調になっている以外は、上の見本のピンクと同じ設定にしております。
6-3 スクロールバーの色は消さない
たまにデザイン上の理由で（？）スクロールバーの色合いを背景色と同じ設定にして隠している方を見かけますが、特別な理由が無い限りはスクロールバーの色合いは出来るだけ消さないようにして下さい。
どうして駄目なのか？
- 消したバーの下部に重要な情報を記載していても、それに気付かない人も出て来る為。
（大画面でパソコンを見ている方ばかりではありません） - ページの文章量が直感的に判らないと不安に思う方も中にはおられます。
（短いと思って読んだ文章が長いと、少し損をした気分になる方もいらっしゃるとか……） - バーが消えている為にスクロールし辛くなり、
そのページを見るのが不快に思う方も中にはおられます。
全ての訪問者がネット関係に詳しい訳ではありません。 サイトのイメージに合わせてバーの色合いを変える事はあっても、バーを隠す事は絶対にお止め下さいね。 （特に入口やリンク集などで消されている方は、加盟しているサーチや同盟から相互リンクと見なされない場合があります）