■　はじめに！

GIFアニメ素材の貼り付け方のページでは基本的な「素材の貼り付け方」を解説させていただきました。
素材屋さんをしていると、GIFアニメ素材をご利用になられる管理人の方々から、様々な質問が寄せられてきます。特に季節物素材のコーナーにあるテーブルタグを使った背景とGIFアニメ素材を組み合わせる表示方法が解らない？　との質問が多く寄せられます。
せっかく気に入って使っていただけるのに説明ページが無いのは不親切です。反省いたしまして、このページで解説させていただきますのでこのページを読んでいただければきっと参考になると思います。
あくまでカツ流 〜ですが…

　　　■　背景の表示

上に表示されているクリスマスで使う「夜のサンタさん」を表示させる例で説明を進めていきますね。
まずは、背景の表示からです。

最初に「夜の森」を表示させるのですが、これは背景として表示させます。
そのままページの背景とし設定してしまうとページ全体に「夜の森」が繰り返してページ全体に表示されてしまいますので、「テーブルタグ」を使って「夜の森」の素材サイズと同じサイズのセル（四角いマス）を作って、そのセルの中の背景として表示させます。

ここまでを表示させると　…

<table border="1">から</table> までがセルを構成するタグ（テーブルタグ）になります。
このタグの中に背景の素材やサンタさんの素材ファイルを組み込んでいきます。
テーブルタグについての説明はここでは控えさせていただきますので、もっと詳しく知りたい方はネットで検索してみてください。

アンダーラインの引いてある background="img/three09.gif" のところで背景にする「夜の森」を指定します。ここで気を付けなければいけない事は、セル（マス）のサイズです。 width="468" height="70" このサイズ指定に気を付けます。 width="468" は「表示させる横幅」、 height="70" は「表示させる高さ」、になりますので「夜の森」の素材サイズと同じになるように指定します。
先に説明した通り、背景として指定すると素材が繰り返して表示されてしまうので「表示させる高さ」の値を大きくすると、画像がダブッて表示されてしまいますので気を付けてください。　
「表示させる横幅」は、横に素材が繰り返してもうまくつながるよう素材を作ってありますから、表示させるスペースに合わせて自由に設定できます。

これで背景の準備が出来ました。

　　　■　背景に素材（サンタさん）を乗せる！

背景の準備が出来たら、次は上にある「サンタさん」をセル（マス）の中に表示させます。
ここまで出来ればあとは簡単！タグを見た方が早いと思いますので、下に書き出しますね。

いかがですか、分かりましたか？　サンタさんのタグは <td>〜</td>の間に書き込みます。

ここで補足ですが、 <td　〜　>のタグに含まれている valign="middle" align="center"について解説しておきます。
valign="　"は、セルの中の素材の縦方向（上下）の表示位置の指定に使います。 top（上ぞろえ）、middle（中央ぞろえ）、 bottom（下ぞろえ）、を指定することが出来ます。何も指定しない場合、縦方向の位置は中央ぞろえになります。
align="　"は、横方向（右左）の表示位置の指定に使います。 left（左ぞろえ）、center（中央ぞろえ）、 rigft（右ぞろえ）、を指定することが出来ます。何も指定しない場合、横方向の位置は左ぞろえになります。
上のタグをそのまま使って表示させてみます。

こうなります。

　　　■　走れ！サンタさん！

サンタさんの表示が出来たら、いよいよサンタさんに走ってもらいます。
別ページの「手軽に画像を動かす方法！」で紹介しているタグ、 <marquee>マーキータグを使います。 このタグでサンタさんを表示させているタグをはさめば、サンタさんが動いてくれます。
ちなみに複数のサンタさんや違う素材を一緒に 走らせたい時は、 <marquee>〜</marquee>の間に動かしたい素材のタグを書き込めばこの間にある素材がみんな動きます。 表示される素材の間隔は、タグのあいだに全角スペースを入れると調整できます。 下にタグを書きますね。

こうすると <marquee>〜</marquee>のマーキータグではさまれている素材が動い てくれます。ちなみに、アンダーライン上の scrollAmount="4"は、動くスピードの指定に使います。 数字の値を大きくすると早くなります。
トナカイとサンタさん動きに合わせると走るスピードは、「4」くらいがちょうどいいと思います。
それでは上のタグを使って表示させてみます。

じゃ〜ん！動いた〜っ！！
これでほぼ完成なのですが、最後に背景の周りに枠が付いていますのでこれを消したら完成です。
枠はそのままでもいいのですが私は消した方が好きなので、いつも消しています。 これは好みの問題ですので、お好みで選んでいただければいいと思います。
<table border="1">の１を０に変更すると、枠は消えます。

　　　■　補　足

ここまでは、季節素材のサンタさんを例に説明してきましたが他の季節素材もありますよね。
基本的に表示の仕方は同じですが、少し解説しておきます。
動かさずに背景と組み合わせるタイプもありますが、これを使う場合はマーキータグを使わなければＯＫです。
複数の素材を並べて表示させたい場合は、それぞれ素材のタグを書き込んだら全角スペースを入れてタグの間隔を調整します。

　　　■　あとがき

いかがでしたか？わかりやすく説明出来てましたか。できるだけ解り易く説明したつもりですが…　
必要最低限のタグで説明してますので、実際にはもっとタグの種類はあります。付け足せば役に立つタグもあります。 ここで紹介している「テーブルタグ」の事などもっと知りたい勉強したい方はネット上には様々な解説サイトが存在しますので検索してみてください。

それでは皆さん！　がんばってくださいね〜！