商品掲載レイアウト例

テーブルを使った商品・広告のレイアウト例を掲載します。テーブルについては既に基本的な知識があるものとして説明します。解説は記事内で使うHTMLでしていますので御参考に。なお、ここで使用する商品はビッダーズから生成されたリンクを使用しています。

レイアウト例１

	ソファー　ロンドン2.5P 価格：57,800円ボタン締め技術を駆使した伝統的英国スタイルをメタリック＆クールに仕上げたデザイン。クロームメッキの鋲とフットがクールに存在感をアピール！
	ウッドスプリングカウチソファ価格：39,800円座面ウッドスプリングですわり心地抜群、さらに通気性バツグンのメッシュ生地を採用しています。両サイドの肘はワンタッチで5段階リクライニングができます。

１列に１商品で縦に並べていくレイアウトです。枠線の太さを"0"にして線を非表示にし、<br>で改行しています。枠線を入れると

	ソファー　ロンドン2.5P 価格：57,800円ボタン締め技術を駆使した伝統的英国スタイルをメタリック＆クールに仕上げたデザイン。クロームメッキの鋲とフットがクールに存在感をアピール！
	ウッドスプリングカウチソファ価格：39,800円座面ウッドスプリングですわり心地抜群、さらに通気性バツグンのメッシュ生地を採用しています。両サイドの肘はワンタッチで5段階リクライニングができます。

こうなります。
ソース

<table border = "0" width = "90%">
<tr><td>生成されたイメージリンク</td></tr>
<td valign = "top">テキストリンク
<br>
価格
<br>
紹介文
</td></tr>
<tr><td>生成されたイメージリンク
・
・
</table>

レイアウト例２

ソファー　ロンドン2.5P
価格：57,800円
ボタン締め技術を駆使した伝統的英国スタイル。

ウッドスプリングカウチソファ
価格：39,800円
座面ウッドスプリングですわり心地抜群。

１列に２商品を掲載した例です。商品説明を長くしすぎるとアンバランスになるので注意して下さい。
枠線を"1"にするとこのようになります。

ソファー　ロンドン2.5P
価格：57,800円
ボタン締め技術を駆使した伝統的英国スタイル。

ウッドスプリングカウチソファ
価格：39,800円
座面ウッドスプリングですわり心地抜群。

ソース

<table border = "0" width = "90%">
<tr><td>生成されたイメージリンク</td>
<td valign = "top">生成されたテキストリンク
<br>
価格
<br>
商品説明
</td>
<td>生成されたイメージリンク</td>
<td valign = "top">生成されたテキストリンク</td>
価格<br>
商品説明
</td></tr>
</table>

商品レイアウト例３