テンプレートとアクセスアップのでめらら楽天日記

2005.06.21
XML
カテゴリ: 【テンプレート】
フレームやフォームなども楽天広場では使えませんので、少しずつ実践のテーブルのテンプレートの作り方を書いてみたいと思います。

手始めに最近の日記からフィルターを使ったものをひとつ作ってみたいと思います。
/////////////////////////////////////////////////////////////

まずは テンプレート基礎(1) の1-1テーブルを作ろう! を参考にテーブルをつくりましょう。

<table border>
<tr>
<td>
【本文内容】

</tr>
</table>

↓こんな感じですね(^^)

【本文内容】


これを横列4列、タテ行2行にしてみましょう

<table border>
<tr>
<td>
【画像1】
</td>
<td>
【画像2】

<td>
【画像3】
</td>
<td>
【画像4】

</tr>
<tr>
<td>
【コメント1】
</td>
<td>
【コメント2】
</td>
<td>
【コメント3】
</td>
<td>
【コメント4】
</td>
</tr>
</table>

↓こんな感じですね(^^)

【画像1】 【画像2】 【画像3】 【画像4】
【コメント1】
【コメント2】 【コメント3】 【コメント4】


ここで、この枠(border)やそれぞれのセル(td)に色を付けたり、線の色、形を変えてテンプレートはできますが、せっかくですのでフィルターをつかってみましょう。

ボーダーには色を付けたくないので"0"を指定して、テーブルの幅を決め、文字の表示位置を決めます。影の部分の詰め物の幅を指定して、影の色と角度を指定しますと・・・
◆ソース◆


<tr>
<td style="width: 100px; padding: 10px; filter: shadow(color=#393939, direction=135);" width="100">
【画像1】
</td>
<td style="width: 100px; padding: 10px; filter: shadow(color=#393939, direction=135);" width="100">
【画像2】
</td>
<td style="width: 100px; padding: 10px; filter: shadow(color=#393939, direction=135);" width="100">
【画像3】
</td>
<td style="width: 100px; padding: 10px; filter: shadow(color=#393939, direction=135);" width="100">
【画像4】
</td>
</tr>
<tr>
<td width="100" valign="top">
【コメント1】
</td>
<td width="100" valign="top">
【コメント2】
</td>
<td width="100" valign="top">
【コメント3】
</td>
<td width="100" valign="top">
【コメント4】
</td>
</tr>
</table>

↓こんな感じですね(^^)

CASIO EX-Z50(EXZ50) スタイリッシュな生活防水付デジタルカメラ”μ30DIGITAL パナソニック デジタルカメラ LUMIXDMC-FX8-A(コンフォートブルー)536万画素CCD 2.5型液晶搭載... キャノン IXY DIGITAL 55 [限定10台送料無料]
スタイリッシュな生活防水付デジタルカメラ”μ30DIGITAL パナソニック デジタルカメラ LUMIXDMC-FX8-A(コンフォートブルー)536万画素CCD 2.5型液晶搭載... キャノン IXY DIGITAL 55 [限定10台送料無料]


*****************************************************

【庶事所感】
時間がなかなか取れなくなると、まとまりの無い内容の日記になってしまって(;大汗)ダメですねぇ(><)
時間のあるときには、こんな風に今まで日記に書いたタグやスタイルを使ってテンプレートを実際作ってみたいと思います。

*****************************************************

なぜか行掛かりでBlogLankingに参加しました(^^;)面白かったらポチして下さいネ

ランキング



リンクはフリーですご自由にどうぞ(バナーリンクタグはprofileのページ年表欄にあります)





お気に入りの記事を「いいね!」で応援しよう

Last updated  2005.08.05 22:45:46
コメント(12) | コメントを書く


【毎日開催】
15記事にいいね!で1ポイント
10秒滞在
いいね! -- / --
おめでとうございます!
ミッションを達成しました。
※「ポイントを獲得する」ボタンを押すと広告が表示されます。
x
X

PR

Keyword Search

▼キーワード検索

Comments

主婦が携帯スマホで月収100万を稼ぐ方法@ 主婦が携帯スマホで月収100万を稼ぐ方法 主婦が携帯スマホで月収100万を稼ぐ方法 …
fipyaqh@ fipyaqh BanUgR &lt;a href=&quot; <small> <a hr…
krjxyqcvrh@ krjxyqcvrh kOkt2k &lt;a href=&quot; <small> <a hr…

© Rakuten Group, Inc.
X
Design a Mobile Site
スマートフォン版を閲覧 | PC版を閲覧
Share by: