こんにちはゲストさん。会員登録(無料)して質問・回答してみよう!

解決済みの質問

画像に解説を入れて並べたいです

パソコンとネットの知識は、ありますが
ブログは初心者です
それで現在FC2ブログに登録してるんですが

画像に解説を入れて、更に
それを隙間を入れて並べたいんです
内容は、大きい画像
一応、文字で書くと、こんな感じですが
それに近いHPを見つけたんで書かせて頂くと
このHPに載ってる写真と解説みたいな感じで
http://tagkouza.nakaj.gozaru.jp/imgalign.html

言葉で表すと


画像 解説    画像 解説  画像 解説
画像 解説    画像 解説  画像 解説
画像 解説    画像 解説  画像 解説


こういう状態で、画像と解説を横に並べたいんです
ちなみに、現時点では
画像1枚に対して2行の解説の予定ですが

応用で出来るならと思い
一応、3行分載せました

それで、そこに載ってるタグを応用して
<img src="gazou.jpg" align="left"><br>解説1行目<br>解説2行目
と入れました

しかし、その後で以前に何かで教えて貰った
<tr><td>を入れて
<img src="gazou.jpg" align="left"><br>解説1行目<br>解説2行目<tr><td>
<img src="gazou.jpg" align="left"><br>解説1行目<br>解説2行目</td></tr>
と入れてもダメでした

宜しく御願いします

投稿日時 - 2009-08-12 18:37:58

QNo.5202152

すぐに回答ほしいです

質問者が選んだベストアンサー

こんにちは #2,3です。

> と、どう違うんでしょうか?

違いですか?<table>タグが正しく使われていないように思えますが。
<tr>~</tr>が一行で、<td>~</td>でひとつのセル(マス目)です。
画像と文字を別々なセル(マス目)にしたのが私のサンプル
で、セル(マス目)が違いますから、leftは必要ありません。

同じひとつのセル内に画像と文字をいれようとしたのがmitsuemonさん
のサンプルですが、<tr>や<td>が正しく入っていないので
うまく表示できないと思います。

なお私のサンプルの最初の<tr>は、わかりやすいように改行
しただけなので<tr><td>と一行にしても良いです。
ちなみに</td>は無くても表示できると思いますが、正しく
タグを覚えるなら、入れておいた方が無難です。

# 「補足」ではこのQ&Aの連絡メールが回答者に来ませんので
# 「お礼」欄を使われると良いかもです。

では。

投稿日時 - 2009-08-16 10:27:49

補足

遅くなりましたが、有難う御座いました

投稿日時 - 2009-08-23 10:34:59

このQ&Aは役に立ちましたか?

1人が「このQ&Aが役に立った」と投票しています

回答(4)

ANo.3

こんにちは #2です。

画像も縦に並ぶのかと思ってしまいました。
<table border=0>
<tr>
<td><img src="画像1.jpg"></td><td>解説1<br>解説2</td>
<td><img src="画像2.jpg"></td><td>解説3<br>解説4</td>
<td><img src="画像3.jpg"></td><td>解説5<br>解説6</td>
</tr>
</table>

では。

投稿日時 - 2009-08-12 22:49:22

補足

回答有難う御座います

結論から言うと
このパターンで成功しました(笑)
ただ、もう1つ聞きたいんですか
今回御紹介のタグ
<table border=0>
<tr>
<td><img src="画像1.jpg"></td><td>解説1<br>解説2</td>
<td><img src="画像2.jpg"></td><td>解説3<br>解説4</td>
<td><img src="画像3.jpg"></td><td>解説5<br>解説6</td>
</tr>
</table>

と、私が実行した
<img src="gazou.jpg" align="left"><br>解説1行目<br>解説2行目<tr><td>
<img src="gazou.jpg" align="left"><br>解説1行目<br>解説2行目</td></tr>

と、どう違うんでしょうか?
http://tagkouza.nakaj.gozaru.jp/imgalign.html
このHPでは
「leftとrightを指定できます。」
と書いてあったんで、タグの中に「left」が入ってないと
ダメなんだと推測したんですが…

投稿日時 - 2009-08-16 09:29:23

ANo.2

こんにちは

Table(表)を使うのであれば、シンプルに
<table border=0>
<tr>
<td><img src="画像1.jpg"></td><td>解説1</td>
<td><img src="画像2.jpg"></td><td>解説2</td>
<td><img src="画像3.jpg"></td><td>解説3</td>
</tr>
<tr>
<td><img src="画像4.jpg"></td><td>解説4</td>
<td><img src="画像5.jpg"></td><td>解説5</td>
<td><img src="画像6.jpg"></td><td>解説6</td>
</tr>
</table>
のような感じでしょうか。

http://masaboo.cside.com/new_html1/ht_27.htm

では。

投稿日時 - 2009-08-12 19:15:44

補足

スイマセン、入れたつもりで忘れてましたが
画像1つに対して解説2~3行で
横に並べたいんです

それで今回は画像を付けさせて頂きました
ちなみに上下の黒い枠(?)は関係ありません

投稿日時 - 2009-08-12 19:41:46

ANo.1

http://tagkouza.nakaj.gozaru.jp/table.html

表のタグを指定しないとダメですよ

<br>入れちゃうと

画像
解説
解説
となってしまうけどいいんですか?

画像 解説 解説
と横並びにはならないけど

投稿日時 - 2009-08-12 19:01:45

補足

スイマセン、入れたつもりで忘れてましたが
画像1つに対して解説2~3行で
横に並べたいんです

それで今回は画像を付けさせて頂きました

投稿日時 - 2009-08-12 19:39:30

あなたにオススメの質問