| ■ スクロールバーの色を指定する(1) |
<div style="width:250px;height:40px;border:solid 1px #ccc;overflow:auto;>
何も指定しなければ、スクロールバーはこのページと同じ設定になります。
</div>
何も指定しなければ、スクロールバーはこのページと同じ設定になります。
|
<div style="width:250px;height:40px;border:solid 1px #ccc;overflow:auto;
scrollbar-arrow-color:#000;
scrollbar-face-color:#ccc;
scrollbar-shadow-color:#ccc;
scrollbar-darkshadow-color:#ccc;
scrollbar-track-color:#fff;
scrollbar-3dlight-color:#ccc;
scrollbar-highlight-color:#ccc;">
arrow-color を黒、track-color を白、それ以外はグレイにしてみました。
</div>
arrow-color を黒、track-color を白、それ以外はグレイにしてみました。
|
<div style="width:250px;height:40px;border:solid 1px #ccc;overflow:auto;
scrollbar-arrow-color:#000;
scrollbar-face-color:#000;
scrollbar-shadow-color:#ccc;
scrollbar-darkshadow-color:#ccc;
scrollbar-track-color:#ccc;
scrollbar-3dlight-color:#ccc;
scrollbar-highlight-color:#ccc;">
face-color を黒、それ以外はグレイにしてみました。
</div>
face-color を黒、それ以外はグレイにしてみました。
|
<div style="width:250px;height:40px;border:solid 1px #ccc;overflow:auto;
scrollbar-arrow-color:#000;
scrollbar-face-color:#ccc;
scrollbar-shadow-color:#000;
scrollbar-darkshadow-color:#ccc;
scrollbar-track-color:#ccc;
scrollbar-3dlight-color:#ccc;
scrollbar-highlight-color:#ccc;">
arrow-color と shadow-color を黒、それ以外はグレイにしてみました。
</div>
arrow-color と shadow-color を黒、それ以外はグレイにしてみました。
|
<div style="width:250px;height:40px;border:solid 1px #ccc;overflow:auto;
scrollbar-arrow-color:#000;
scrollbar-face-color:#ccc;
scrollbar-shadow-color:#ccc;
scrollbar-darkshadow-color:#000;
scrollbar-track-color:#ccc;
scrollbar-3dlight-color:#ccc;
scrollbar-highlight-color:#ccc;">
arrow-color と darkshadow-color を黒、それ以外はグレイにしてみました。shadow-color とは微妙に違います。押してみるとさらに違いがわかりますよ。
</div>
arrow-color と darkshadow-color を黒、それ以外はグレイにしてみました。shadow-color とは微妙に違います。押してみるとさらに違いがわかりますよ。
|
<div style="width:250px;height:40px;border:solid 1px #ccc;overflow:auto;
scrollbar-arrow-color:#000;
scrollbar-face-color:#ccc;
scrollbar-shadow-color:#ccc;
scrollbar-darkshadow-color:#ccc;
scrollbar-track-color:#ccc;
scrollbar-3dlight-color:#000;
scrollbar-highlight-color:#ccc;">
arrow-color と 3dlight-color を黒、それ以外はグレイにしてみました。
</div>
arrow-color と 3dlight-color を黒、それ以外はグレイにしてみました。
|
<div style="width:250px;height:40px;border:solid 1px #ccc;overflow:auto;
scrollbar-arrow-color:#000;
scrollbar-face-color:#ccc;
scrollbar-shadow-color:#ccc;
scrollbar-darkshadow-color:#ccc;
scrollbar-track-color:#ccc;
scrollbar-3dlight-color:#ccc
scrollbar-highlight-color:#000;">
arrow-color と highlight-color を黒、それ以外はグレイにしてみました。3dlight-color とは微妙に違います。
</div>
arrow-color と highlight-color を黒、それ以外はグレイにしてみました。3dlight-color とは微妙に違います。
|
| ■ スクロールバーの色を指定する(2) |
<div style="width:250px;height:40px;border:solid 1px #ccc;overflow:auto;
scrollbar-base-color:#ccc;">
base-color を指定すれば、自動で同系色に設定してくれます。これは base-color をグレイにした場合です。
</div>
base-color を指定すれば、自動で同系色に設定してくれます。これは base-color をグレイにした場合です。
|
<div style="width:250px;height:40px;border:solid 1px #ccc;overflow:auto;
scrollbar-base-color:#00f;">
base-color を青にするとこうなります。
</div>
base-color を青にするとこうなります。
|
<div style="width:250px;height:40px;border:solid 1px #ccc;overflow:auto;
scrollbar-base-color:pink;">
base-color をピンクにするとこうなります。
</div>
base-color をピンクにするとこうなります。
|
