img
白 クリーム 黄色 淡い緑 水色 淡い青紫 淡いグレー グレー 黒 茶 赤 濃いピンク ピンク

スクロールバーの色


スクロールバーに色を付ける

  ie6

スクロールバーの色を指定する方法です。scrollbar-base-color等を利用することで色を変えることができます。
<head></head>に入れるとページ全体を、textareaに指定すればそのtextareaの色を指定します。
(ie5.5〜)

■ 変更できるスクロールバーの箇所一覧

↓スクロールバー全体に色が付きます
scrollbar-base-color : バーのベースの色名
↓スクロールバーの各場所に対して色が付きます
scrollbar-face-color : バー表面の色名
scrollbar-arrow-color : バーの矢印の色名
scrollbar-track-color : 背景の色名
scrollbar-3dlight-color : バー外側/左と上の色名
scrollbar-highlight-color : バー内側/左と上の色名
scrollbar-shadow-color : バー内側/右と下の色名
scrollbar-darkshadow-color : バー外側/右と下の色名


■ ページ全体に適用

<head></head>の間に入れるとページ全てのスクロールバーに適用します。   sample




■ テキストエリアを個別に適用

テキストエリアにスタイルとして指定すれば、同じページの複数のテキストエリアに適用できます。
個別にテキストエリアのスタイルを設定するには style="scrollbar-*****-color:色名 "を追加して下さい。
スクロールバーの場所を複数指定することもできます。



例: <textarea rows="5" cols="30" style="padding : 5px; border-style : solid ; border-color : red ;scrollbar-face-color : #00ff99 ; scrollbar-arrow-color : #009933;">内容</textarea>