HTML 4.01 Transitional
互換モード

Internet Explorer Sleipnir Lunascape などで「透過」が適用される。

CSS （関連部分のみ）

body {
margin: 0;
background-image: url(http://file.sever.blog.shinobi.jp/top_bg.gif);
overflow: hidden; /* スクロールバーを表示しない */
scrollbar-3dlight-color:#ff1493;
scrollbar-arrow-color:#00f;
scrollbar-darkshadow-color:#00f;
scrollbar-face-color:#ff1493;
scrollbar-highlight-color:#00f;
scrollbar-shadow-color:#ff1493;
scrollbar-track-color:#ff1493;}

.scroll {
width: 100%; /* 適用範囲の指定 */
height: 100%; /* 適用範囲の指定 */
overflow: auto; /* スクロールバー自動表示 */
filter: chroma(color=#ff1493)} /* 透過色を指定 */

step 01 body にスクロールバーの色替えを指定

step 02 色を確認後 body にスクロールバー非表示とする

step 03 .scroll と言うセレクタを新設。そっくりコピーして透過色だけを変更すればよい。

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd"> 
<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<meta http-equiv="Content-Style-type" content="text/css">
<link rel="stylesheet" href="tr0.css" charset="Shift_JIS" type="text/css">
<title>タイトル</title>
</head>
<body>
<div class="scroll"> 
<div class="center">
<div class="mcenter">
内容
</div>
</div>
</div> 
</body>
</html>

step 04 文書型宣言に dtd ファイル URL があれば削除して
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
と「互換モード」にする。

step 05 <body> のスグ下に <div class="scroll"> を挿入。

step 06 </body> のスグ上に </div> を挿入。

Netscape Mozilla Firefox Safari (Mac) では標準のスクロールバーで表示され、Opera では色替えしたカタチで透過しないスクロールバーになる。

HTML 4.01 Transitional互換モード

HTML 4.01 Transitional
互換モード