美容・健康・ファッション・インテリア・DVD・お花・ギフト 安全安心のお買い物

町工場ネット トップ  ◇サイトマップ ◇新規登録 ◇プライバシーポリシー ◇相互リンクの方法 ◇問い合わせ

町工場 | 総合 | 美容 | ファッション | インテリア | 家電 | 資格| 食料 | 個人開業 | 書籍 | ギフト | ホビー | CD・DVD

←前に戻る トップページ 内容一覧 次へ進む→
■簡単な装飾 表を使う 4

よく見かけるレイアウトで左側だけ色の違うものがあります。あれはどうすればいいのでしょう。いろんな方法があります。フレームを使うという方法もありますが、最初はややこしいので、表を使ってみましょう。

<TABLE width="100%">
<TBODY>
<TR>
<TD width="20%" bgcolor="#0000cc" height="368">
<FONT color="#ffffff">
よく見かけるレイアウトです。<BR>
ここにメニューを表示したりします。
</FONT>
</TD>
<TD width="80%" height="368" bgcolor="#ffffff">
このようなレイアウトはいろんな方法で実現できます。<BR>
背景そのものを2色にすることでもできますが,背景でわけると表示画面によっては文字がうまく並ばなくなります。<BR>
最初から表を使うほうが簡単です。<BR>
見る人がみんなあなたと同じ環境だとは限りません。あまり複雑なレイアウトにしてもうまく表示されないことが多いものです。
</TD>
</TR>
</TBODY>
</TABLE>

サンプル13のソースです。

<TABLE width="100%">
表全体の大きさを100%で指定し
<TD width="20%" bgcolor="#0000cc" height="368">
左側のセルの大きさを表に対して20%にしています。
最初にソースに書いたセルが左のセルになります。
<TD width="80%" height="368" bgcolor="#ffffff">
右のセルの大きさは表に対して80%にしています。
height  セルの高さです。

%の割合や色、高さを変えて試してください。

□ サンプル13を表示する(新しいタブで表示する)

←前に戻る トップページ 内容一覧 次へ進む→