ホームページビルダー・グレート初心者講座

Yahoo!ブックマークに登録

グレート初心者講座トップへグレート初心者講座 小技集へグレート初心者講座 FAQへグレート初心者講座 質問掲示板へ





 テーブルの表題部分に背景画像を使った説明枠

とくに小技ではありませんが、説明枠などを作るとき表題部分に背景画像を利用するだけで綺麗な印象になります。



 サンプル

表題部分
ああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああ





 作成方法

1. 表の挿入

下のような 2行 1列 の表を挿入します。






2. 表の枠と罫線の幅を消す

作成中の表のセル(2つのうちどれでも結構です)を右クリックして「属性の変更」を選択し、下の画像にある「表」というタブをクリックすると、下の画面になりますので 罫線の幅を 0ピクセル セル内の余白を 0ピクセル 枠表示を 0ピクセル に設定して下さい。





3. 表題部分の背景画像設定とセルの高さ設定

表題部分(上)のセルを右クリックし 「属性の変更」 をクリックすると下のような設定画面が表示されます。
ここで 「セルの高さ」 を例では 25ピクセルに設定し、次に「参照」ボタンを押して背景画像にしたい画像を選択します。
とりあえず試してみたい場合は下のほうにあるサンプルの背景画像を右クリックで保存して利用して下さい。

テーブルデザイン セル設定


背景画像サンプル
右クリックし「名前を付けて画像を保存」で保存してご利用下さい
     




4. 表の枠線を設定する


作成中の表のセル(2つのうちどれでも結構です)を右クリックして「属性の変更」を選択し、下の画像にある「表」というタブをクリック、その中の「スタイル」ボタンを押し 「現在のタグのみに〜の編集」→「レイアウト」タブと選択します。
すると下のような設定画面になりますので、枠線の設定を行います。
下の赤丸部分で設定しますが、枠線の色などは好みの色を設定して下さい。








5. 表題セルの下部線を設定する


これはどちらでも構いませんが、表題セルの下部の線を設定します。
表題セルを右クリックして 「スタイルの設定」→「現在のタグのみに〜の編集」→「レイアウト」タブをクリックすると下の画像のような設定画面になりますので、左上の「4方向とも同じ値」というオプションメニューをクリックして 「下方向」に変更します。
次に中断の「ボーダー」項目の設定を行いますが、ここでは表の枠と同じく 1ピクセル、実線、黒で設定しました。


テーブルデザイン セルの下部線設定




これで作成完了です。
後はページに合わせて表のサイズを修正したり、セルの中にタイトルや説明などの文字列を入れます。






| トップページへ | 小技集 | FAQ | 質問掲示板 | 免責事項  | リンクについて  | お問い合わせ  |
ホームページビルダー・グレート初心者講座 Copyright © 2002-2005 aimix All Rights Reserved