Purple town

Purple town

HTMLテンプレートの活用術７


前回同様２つめのテーブルを持ってきましょう。

    <!--２つ目のテーブル開始-->
  1. <table width="100%" border="0" cellspacing="0" cellpadding="0">
  2. <tr valign="top">
  3. <td width="10"><font size="-1" color="#000066">■</font></td>
  4. <td width="8">

    5. <!--スペース用の空きテーブル-->
  5. <table width="8" border="0" cellspacing="0" cellpadding="0"><tr><td></td></tr></table>

  6. </td>
  7. <td width="100%"><font size="-1">

  8. ★★★ ここにアフィリエイト用のテキストリンクのソースを入れる ★★★
  9. <br>
  10. ★★★ ここに紹介文を入れる ★★★
  11. <br>

  12. </font></td>
  13. </tr>
  14. </table>
    15. <!--２つ目のテーブルを閉じます-->

これを表示すると↓のようになります。

■
★★★ ここにアフィリエイト用のテキストリンクのソースを入れる ★★★
★★★ ここに紹介文を入れる ★★★

紹介文の回りにだけ点とか二重線とか色をつけたいと思うかもしれません。その場合も［style］の出番。
テキストの入る７行目の<td>の［width="100%"］を取って後ろにスタイルを宣言します。<td style="width:100%;border:double thick #33e0d0;" >

■
★★★ ここにアフィリエイト用のテキストリンクのソースを入れる ★★★
★★★ ここに紹介文を入れる ★★★

文字とケイとの間に空間がなく、詰まった感じなのでパディングの指定をいれます。
<td style="width:100%;border:double thick #33e0d0; padding:5px;" >

■
★★★ ここにアフィリエイト用のテキストリンクのソースを入れる ★★★
★★★ ここに紹介文を入れる ★★★

もしくは２行目（<tr valign="top">）　～　６行目（</td>）までを削除。
左側が太い囲み罫という指定も出来るようになります。
<td style="width:100%;border: solid 1px #33e0d0; border-left-width:5px; padding:5px;">

★★★ ここにアフィリエイト用のテキストリンクのソースを入れる ★★★
★★★ ここに紹介文を入れる ★★★


© Rakuten Group, Inc.
X

Design a Mobile Site
スマートフォン版を閲覧 | PC版を閲覧
    Share by: