ホームページビルダー小技編
スタイルシート関連
- 色付きスクロールバー
- 色つきスクロールバー【ビルダー11での操作】
- IE6でスクロールバーの色が変わらない場合
- インラインフレームの枠線変更
- 消えている文字が表示されたとき、リンクできるようにする<どこでも配置モード>
色付きスクロールバー(ＩＥ5.5以上のブラウザしか表示できません。)
スタイルシートを使用しますが、ビルダーではサポートしていないため直接、ソースを挿入します。また、下記の手順はページ内にスタイルを設定します。サイト全体へスタイルを反映させたい場合は外部スタイルシートのbodyタグに対してスタイル設定を行います。
※ビルダー11では色つきスクロールバーの設定をサポートしました。
ビルダー11での操作
- 下のソースをコピーする
- <HEAD>内に貼り付けます。 参考 HTMLソースの貼り付け方
- 色の変更はHTMLソースで直接変更します。
SCROLLBAR-****-COLOR;@@@@; とある@@@@の部分で色を変更します。#000000の入力でもOK
色んな箇所の色を変更して試してみてください。(下のソースはスクロールバーの色をピンクに設定しています。)
<!--==ここからコピーしてください =======-->
<style type=text/css>
<!--
body {
scrollbar-face-color: pink;
scrollbar-track-color: white;
scrollbar-arrow-color: white;
scrollbar-3dlight-color: black;
scrollbar-highlight-color: white;
scrollbar-shadow-color: hotpink;
scrollbar-darkshadow-color: black;
}
-->
</style>
<!--====ここまで=================-->
ビルダー11での操作/スクロールバーの色を変更
スタイルの設定画面より、bodyタグに対してスタイルの設定を行います。
[IE拡張]タグをクリックして[スクロールバー]項目を設定していきます。画面右にある[標準]のボタンをクリックして色を選択します。
(※赤で記載している文字は上図で確認するためのもので、実際には表示されません。)
IE6でスクロールバーの色が変わらない場合
IE5.5ではスクロールバーの色が確認できたのに、IE6になってから色が表示されなくなった場合は、HTMLのVer.の宣言の部分を変更してみてください。
変更方法
ツール→オプション→ファイル→「DOCTYPEを出力する」 この箇所に入力する領域があるのでここを確認します。もし、
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 //EN">
などとなっている場合は Transitional を付け加え、下の様に変更してください。
<!DOCTYPE HTML PUBLIC"-//W3C//DTD HTML 4.0 Transitional//EN">
DOCTYPE箇所を変更後、ページをビルダーで開き、保存することによって自動的に書き換えられます。