準備　　　　・お好きな画像を用意します。当方の素材コーナーにもいくつか置いてありますが
　　　　　　　簡単な画像ですので、ご自分でお作りになるのも楽しいかと思います。その場合
　　　　　　　は<図1>の様に赤（正方形、同一サイズ4）、紺（赤の幅、高さを二辺に持つ長
　　　　　　　方形2×2）の四角が出来るようにスライスし、.gif（.jpeg .png）で書き出しま
　　　　　　　す。任意のフォルダーに画像を保存しておきます。

ソフト　　　・空白のセルについての設定を確認して下さい。"環境設定""コードフォーマット"
　　　　　　　等から "空白セル" "空タグの文字"について、「全角スペース」または半角の
　　　　　　 「&nbsp; 」が自動的に入るように設定してあればOKです。
　　　　　　 「そんなこと言われてもぉ……」とおっしゃる方もご心配なく、
　　　　　　　後ほど対処法をご説明いたします。

　
　<図2>
　3行3列のテーブル

<ストレートラインの枠>を作る
・では作ってみましょう。まずは3行3列のテーブルを作ります。
　テーブルの幅は作りたい大きさに合わせて適当に指定しておくか、
　決まったサイズが有ればそれを数値で指定します。高さは指定しません、
　セル余白は0、セル間隔も0です。
・四隅、赤のアルファベット部分のセルに、ガイドに従ってそれぞれの画像を
　貼り込みます。
・貼り込んだ画像と同じ大きさに、セルのサイズを数値で指定します、
　これは四隅ともきっちりと決めておきましょう、型崩れ防止のためです。

・次は紺色数字部分のセルにそれぞれの背景画像を指定して設定します。
　ここはくれぐれもお間違いの無い様に、セルの背景画像です。これによって紺色、
　数字部分のセルのサイズが変わっても画像が途切れることはないわけですね。

　・<図4>のようになっていれば成功です。
　　ブラウザで、セルの隙間やズレの有無を
　　確認して見るのも良いですね。もしも、
　　ズレや隙間を見つけてしまったら----

・テープルの設定を見直してみます。セル余白、間隔は"0"になっているでしょうか。
　"0になっているのに開いている"、または "0にしたけれどまだ開いている" 場合は、　セルを左、または上に詰めてください。セルを選択して ←、↑キーで移動します。