ＨＴＭＬで画像を貼り付け

質問

不明な点がありましたら補足要求かけてください。よろしくお願い致します。
自分のＨＰにリンク先の背景を乗せ、後付けでその背景の上に動画像（heart1とbanner）２タイプを左右端上貼りたいのです。
以下が背景タグでこれに画像を乗せたいのです。
（プライベートな部分は★に変えてあります。）
<table width="390" border="0" cellpadding="3" cellspacing="0" bgcolor="#241C43" height="80">
<tr>
<td width="19%" height="52"><a
href="http://www.★.net/ring/index.htm" target="_top"> </a> <a href="http://www.★.net/ring/index.htm"><img src="heart1.gif" width="66" height="50" border="0"></a>
</td>
<td width="81%" height="52">
<div align="center"><a href="http://www.★.net/ring/index.htm"><img src="ring_banner.gif" width="306" height="35" border="0"></a><br>
<font size="1"> <font color="#FFFFFF"> 　 ★★</font></font>
</div>
</td>
</tr>
<tr>
どうぞよろしくお願い致します。

回答No.2

lamp_tomori · ベストアンサー

こんばんは。＃１です。再度失礼致します。
下ではお答えしたことがご希望にあっていたようで何よりです（＾＾）

そうして補足に書かれているタグですが…。
私の環境（WinXP／IE6.0）では質問者様のお考えのとおり横並びに表示されますがどういった環境でご確認でしょうか？
また、タグはご質問のタグにそのまま続けてよろしいでしょうか。
と言いますのも、テーブルタグと言うものは、全体的な値設定によって表示がまったく変わってきます。もし現在の書き方で縦ならびになってしまう場合、ご質問のタグと補足のタグの間に何か他の記述があったらそのせいかもしれません。
今回のタグもあわせ、単純なミスを修正したものを記述しておきますので一度こちらをコピーして確認してみてください。

<table width="390" border="0" cellpadding="3" cellspacing="0" bgcolor="#241C43" height="80">
<tr>
<td width="19%" height="52><a href="http://www.★.net/ring/index.htm"><img src="heart1.gif" width="66" height="50" border="0"></a>
</td>
<td width="81%" height="52" valign="top" align="right">
<a href="http://www.★.net/ring/index.htm"><img src="ring_banner.gif" width="306" height="35" border="0"></a><br>
<div align="center"><font size="1" color="#FFFFFF">★★</font></div>
</td>
</tr>
<tr>
<td colspan=2 align="center">
<font color=#FFCC99>-</font> <a href=http://www.★.ne.jp/cgi-bin/webring?ring=intlring;random target=_blank><font color=#FFFFFF size=2 face=Arial Helvetica sans-serif>random</font></a> <font color=#FFCC99>-</font> <a href=http://www.★.ne.jp/cgi-bin/webring?ring=intlring;id=1062;next target=_blank><font color=#FFFFFF size=2 face=Arial Helvetica sans-serif>next</font></a> <font color=#FFCC99>-</font> <a href=http://www.★.ne.jp/cgi-bin/webring?ring=intlring;id=1062;back target=_blank><font color=#FFFFFF size=2 face=Arial Helvetica sans-serif>back</font></a><font color=#FFFFFF size=2 face=Arial Helvetica sans-serif> </font><font color=#FFCC99>-</font> <a href=http://www.★.ne.jp/cgi-bin/webring?ring=intlring;id=1062;list target=_blank><font color=#FFFFFF size=2 face=Arial Helvetica sans-serif>list</font></a> <font color=#FFCC99>-</font> <a href=http://www.★.ne.jp/cgi-bin/webring?ring=intlring;id=1062;addform target=_blank><font color=#FFFFFF size=2 face=Arial Helvetica sans-serif>touroku</font></a> <font color=#FFCC99>-</font> <a href=http://www.★.net/ring/index.htm target=_blank><font color=#FFFFFF size=2 face=Arial Helvetica sans-serif>about</font></a> <font color=#FFCC99>-</font>
</td>
</tr>
</table>

上のタグでは確実に横並びにするためにリング部分の改行をなくしてみました。また、センタリングの p と div が被っていましたので削除して、tdタグのalignを使用しています。テーブルの高さは td 部分でheight設定をしていたため、その設定も削除しています。

お礼

再度ご回答下さり、有難うございます！
お返事とても楽しみに待ってました（＾＾）。
ご指示頂いた様にやってみたらちゃんと作ることが出来ました！
とてもわかりやすく説明してくださって本当に感謝です。
またご縁がありました際にはどうぞよろしくお願い致します！

回答No.1

lamp_tomori

こんにちは。
ちょっと質問の意味がよく理解出来ないのですが、タグを見るには
・背景色 #241C43、幅390 のテーブルの中にリンクバナー（heart1.gif・ring_banner.gif）を左右端に表示させたい
でよろしいのでしょうか？
とりあえず上の条件で表示させる場合の単純なタグのミスを修正したものを下に書きますので、やりたいことと違う場合は補足を入れていただければもう少しお手伝いできるかと思います。

<table width="390" border="0" cellpadding="3" cellspacing="0" bgcolor="#241C43" height="80">
<tr>
<td width="19%" height="52" valign="top"><a href="http://www.★.net/ring/index.htm" target="_top"><img src="heart1.gif" width="66" height="50" border="0"></a>
</td>
<td width="81%" height="52" valign="top" align="right">
<a href="http://www.★.net/ring/index.htm"><img src="ring_banner.gif" width="306" height="35" border="0"></a><br>
<font size="1" color="#FFFFFF">★★</font>
</td>
</tr>
</table>

上のタグですと、幅390のテーブルの中に、左上に幅66のheart1.gifを配置、右上に幅306のring_banner.gifを配置することになります。

補足

早々のご回答、有難うございます！
すみません、私は知識ゼロなのでうまく説明が出来ませんでしたが回答者様は見事当方の求めていた回答を下さり、とても助かりました。
ご回答を拝見しながら貼り付けはおかげさまで完了しましたが、また別の問題が出てしまったのでもし当方の下手な説明を理解して頂けましたら再度ご回答下さいませんか？
以下、上記の続きなのですが
</font></font>
</div>
</td>
</tr>
<tr>
<td height=29 colspan=2>
<div align=center>
<p align=center>
<fontcolor=#FFCC99>-</font> <a href=http://www.★.ne.jp/cgi-bin/webring?ring=intlring;random target=_blank><font color=#FFFFFF size=2 face=Arial Helvetica sans-serif>random</font></a>
<font color=#FFCC99>-</font> <a href=http://www.★.ne.jp/cgi-bin/webring?ring=intlring;id=1062;next target=_blank><font color=#FFFFFF size=2 face=Arial Helvetica sans-serif>next</font></a>
<font color=#FFCC99>-</font> <a href=http://www.★.ne.jp/cgi-bin/webring?ring=intlring;id=1062;back target=_blank><font color=#FFFFFF size=2 face=Arial Helvetica sans-serif>back</font></a><font color=#FFFFFF size=2 face=Arial Helvetica sans-serif>
</font><font color=#FFCC99>-</font> <a href=http://www.★.ne.jp/cgi-bin/webring?ring=intlring;id=1062;list target=_blank><font color=#FFFFFF size=2 face=Arial Helvetica sans-serif>list</font></a>
<font color=#FFCC99>-</font> <a href=http://www.★.ne.jp/cgi-bin/webring?ring=intlring;id=1062;addform target=_blank><font color=#FFFFFF size=2 face=Arial Helvetica sans-serif>touroku</font></a>
<font color=#FFCC99>-</font> <a href=http://www.★.net/ring/index.htm target=_blank><font color=#FFFFFF size=2 face=Arial Helvetica sans-serif>about</font></a><font color=#FFFFFF size=2 face=Arial Helvetica sans-serif>
</font><font color=#FFCC99>-</font> </p>
</div>
</td>
</tr>
</table>

これで画面を見ますと
-random
- next
- back
- list
- touroku
- about

とセンターに縦表示になっているのですがこれを
-random - next - back - list - touroku - about
と横表示にし、同時に全体のテーブル（？）の高さの幅を狭めたいのですが・・・
わかりづらくて申し訳ありません。
もしよろしければご回答下さい。待ってます。