CSS入門<スクロールバー色変更(IE独自)>  2008
12/14
日曜日
 気が付きました?(気付く訳ねえだろ、おっ)

 何、何、って自分が嬉しいだけなのだけれど、ブログのナビゲータとコンテンツの境目のスクロールバーがゴールドになったでしょ。ブラウザがIE(インターネットエクスプローラ)独自仕様だから、Safariとか、Fireboxの方はごめんなさい。

 以前から、CSS(Cascading Style Sheets)って仕様があってね、W3C勧告をIEは先行して実装している。一度トライしてみたかった。僕は毎日ブログの色は気分で変えるので、あまり必要を感じてはいないけどね、知っていて損はない。

 ってことで、通常、サイトを運営や制作している方は、デザインの統一感を持たせるために、ちょっとフォントの色を変えたい、デザインを変化させたい、余白や配置など、いろいろあるのでしょうけど、たくさんあるhtmlソースをひとつずつ修正していたら大変でしょ。実質不可能でしょうね、多すぎて。

 なので、外部ファイルにそれらを共通的に記述しておけば、htmlソースの中で、その外部ファイルを指定しておくと、外部ファイルを修正するだけで全体スタイルを、ぱっと変更できるのですよね。

 CSSファイルの中身は、
html,body {
scrollbar-base-color: #xxxxxx; (xxxxxxは色指定)
}

だけだよ、それと、htmlソースに
<html>
<head>
<link rel="stylesheet" href="sample.css" type="text/css">
</head>
<body>

を書くだけ。ね、簡単でしょ。誰も興味ないだろうけれど、今後、CSSを完全マスターするためのきっかけになったのが嬉しかったね。 今回は、スクロールバーのベース色だけで、後々、トライしていこうと思うけど、行間が詰まっているのを調整したり、まず、これをやりたいな。まだ他の仕様もあるんだよね。

scrollbar-base-color・・・・・・スクロールバーのベース色を指定する(IE独自)
scrollbar-face-color・・・・・スクロールバーの表面の色を指定する(IE独自)
scrollbar-track-color・・・・・スクロールバーの下地の色を指定する(IE独自)
scrollbar-arrow-color・・・・スクロールバーの矢印の色を指定する(IE独自)
scrollbar-highlight-color・・スクロールバーのハイライトの色を指定する(IE独自)
scrollbar-shadow-color・・・スクロールバーの影の色を指定する(IE独自)
scrollbar-3dlight-color・・・スクロールバーの左端と上端の色を指定する(IE独自)
scrollbar-darkshadow-color・・スクロールバーの右端と下端の色を指定する(IE独自)

 どう変化するかは、このページが解りやすい。→ 【スクロールバーの色指定の比較】
 ほんと趣味の世界のマスターベーションですよね。じゃ。
Copyright (C) 2008 Shougo Iwasa. All Rights Reserved.