HOME l  Free Software ( フリーソフト トップページ ) l IBM Homepage Builder


IBM Homepage Builder V11  テーブルのカスタマイズ 2 スタイルシートは未使用
スポンサー


写真のイメージアップには、縁取り効果とフォトフレームを使用出来ます又写真を好きなサイズに指定して抽入出来ます。


* HTML へ画像の抽入は、ページの表面に画像を抽入した場合は、そのままのサイズにて表示され、 BODY 又はテーブル
の背景画に指定の場合は、重複されて表示されます。筆者はペイントはあまり得意でないので?テーブルを綺麗に装飾出来ませんが参考にされて下さい。

テーブル 内容

横幅値は、 A B C D へ指定、 縦幅値は、A E I M とヘッド(先頭)部分のみに入力!それ以外の部分に異なる数値が入っていた場合は、バッティング(競合)して正常にテーブルは表示されません。

A B C D
E
I
M


テーブルの外枠 ( border="0") を未表示にして罫線 (cellspacing="1") を表示してテーブルを表現しています。

<TABLE border="0" cellpadding="5" cellspacing="1" width="150" bgcolor="#000040">
<TR>
<TD bgcolor="White" height="60"></TD>
</TR>
</TABLE>



Topics
<TABLE border="0" cellpadding="5" cellspacing="1" width="150" bgcolor="#000040">

<TR>
<TD bgcolor="#000099"><B><FONT color="#ffffff">Topics</FONT></B></TD>
</TR>
<TR>
<TD bgcolor="White" height="60"></TD>
</TR>

</TABLE>


Topics



Topics

スペース

縦に3つのテーブルを使用し、真ん中に空白のテーブルにてスペースを作成している。

<TABLE border="0" cellpadding="5" cellspacing="0" width="150">
<TR>
<TD bgcolor="#000099"><B><FONT color="#ffffff">Topics</FONT></B></TD>
</TR>
</TABLE>
<TABLE border="0" cellpadding="0" cellspacing="0">
<TR>
<TD height="2"></TD>
</TR>
</TABLE>

<TABLE border="0" cellpadding="5" cellspacing="1" bgcolor="#000099" width="150">
<TR>
<TD width="150" height="60" bgcolor="White"></TD>
</TR>
</TABLE>



Topics



Topics

スペース

外枠は未表示!
<TABLE border="0" cellpadding="5" cellspacing="0" width="150">
<TBODY>
<TR>
<TD bgcolor="#000099"><B><FONT color="#ffffff">Topics</FONT></B></TD>
</TR>
</TBODY>
</TABLE>
<TABLE border="0" cellpadding="0" cellspacing="0" bgcolor="#0000ff">
<TBODY>
<TR>
<TD height="2" bgcolor="White"></TD>
</TR>
</TBODY>
</TABLE>
<TABLE border="0" cellpadding="0" cellspacing="0" width="150">
<TBODY>
<TR>
<TD height="60" bgcolor="White" width="50%" valign="top" align="left">
<TABLE border="0" width="99%" cellspacing="1" bgcolor="#000099">
<TBODY>
<TR>
<TD bgcolor="White" height="60"></TD>
</TR>
</TBODY>
</TABLE>
</TD>
<TD bgcolor="White" width="50%" valign="top" align="right">
<TABLE border="0" width="99%" cellpadding="0" cellspacing="1" bgcolor="#000099">
<TBODY>
<TR>
<TD bgcolor="White" height="60"></TD>
</TR>
</TBODY>
</TABLE>
</TD>
</TR>
</TBODY>
</TABLE>


Topics



Topics

青枠は未表示!

<TABLE border="0" cellpadding="2" cellspacing="1" width="150" bgcolor="#000040">
<TR>
<TD bgcolor="White" height="60" valign="top">
<TABLE border="0" width="100%" bgcolor="#000040">
<TR>
<TD><B><FONT color="#ffffff">Topics</FONT></B></TD>
</TR>
</TABLE>
<TABLE border="0" width="100%">
<TR>
<TD height="50"></TD>
</TR>
</TABLE>
</TD>
</TR>
</TABLE>


Topics
「Topic」 部分の背景画像に  画像を指定。

<TABLE border="0" cellpadding="5" cellspacing="1" width="150" bgcolor="#000040">
<TR>
<TD background="ibm/boder1.gif"><B><FONT color="#ffffff">Topics</FONT></B></TD>
</TR>
<TR>
<TD bgcolor="White" height="60"></TD>
</TR>
</TABLE>

 素材を作成したツール
彩彩畑

素材作成ツール。グラデェーションを使用して簡単にシンプルな素材を作成出来ます。


Topics
「Topic」 部分のテーブルの背景画像に  画像を指定。

<TABLE border="0" cellpadding="5" cellspacing="1" width="150" bgcolor="#4aa5ff">
<TR>
<TD background="ibm/tdra1.png" height="17"><B><FONT color="#000000">Topics</FONT></B></TD>
</TR>
<TR>
<TD bgcolor="White" height="71"></TD>
</TR>
</TABLE>

Topics



Topics


青枠は未表示に!

「Topic」 部分のテーブルの背景画像に  画像を指定。

<TABLE border="0" cellpadding="0" cellspacing="0">
<TR>
<TD background="ibm/tdra3.png" align="center" height="25" width="183"><FONT color="#c0c0c0"><B><FONT color="#000000">Topics</FONT></B></FONT></TD>
</TR>
<TR>
<TD bgcolor="White" height="71" valign="top" width="183">
<TABLE border="0" width="100%" cellpadding="3" cellspacing="1" bgcolor="#ff0000">
<TR>
<TD height="64" bgcolor="White"></TD>
</TR>
</TABLE>
</TD>
</TR>
</TABLE>

 素材を作成したツール
AquaMaker

クリスタルなアクアタイプのボタンを簡単作成。ウィンドウズのペイントで必要な部分を切り取って使用。


Topics
「Topic」 部分のテーブルの背景画像に  画像を指定。

<TABLE border="0" cellpadding="5" cellspacing="1" width="150" bgcolor="#000040">
<TR>
<TD background="ibm/vq3.png"><B><FONT color="#ffffff">Topics</FONT></B></TD>
</TR>
<TR>
<TD bgcolor="White" height="60"></TD>
</TR>
</TABLE>


mikasaphp.net  ( ホーム ) l Free Software ( フリーソフト トップページ )
Windows 98 l Windows XP l Windows Vista l Windows 7 l Windows 8 ( ウィンドウズ紹介ページ )
Sitemap ( サイトマップ ) l 利用規約及びリンクについて l プライバシーポリシー l メール送信フォーム
Copyright (C) Mikasaphp All Rights Reserved