htmlのテーブルタグについて

質問

<table border>

<td class="timg"><a href="img/zyuni1.gif" class="thickbox" title="文字"><a href="http://www.yahoo.co.jp"><img src="img/zyuni1.gif" alt="" /></a></a>

<td class="tdesc">

<a href="http://***" target="_blank" style="color:#0000ff;"><img src="http://hbb.afl.rakuten.co.jp/hgb/?pc=http%3a%2f%2fthumbnail.image.rakuten.co.jp%2f%400_mall%2fangfa%2fcabinet%2f2012item%2f201204_oily_reg2.jpg%3f_ex%3d300x300&m=http%3a%2f%2fthumbnail.image.rakuten.co.jp%2f%400_mall%2fangfa%2fcabinet%2f2012item%2f201204_oily_reg2.jpg%3f_ex%3d80x80" Align="left"><p>文字

<Br clear="left"><br><br><br>
<img src="./img/attention.png" alt="" /><a href="http://www.yahoo.co.jp"><span style="font-size:18px;"><strong>文字

</p>
<br />
<p><a href="#">文字</a></p>
</td></tr>

<tr>
<th>文字</th>
<th>文字</th>

<tr>
<td>文字円</td>
<td>文字円</td>

</td></tr></table>

</table>

今テーブルタグで、例なのですが・・・。
このようにして、打っております。
しかしながら、非常に・・・テーブルが大きすぎると感じ、
もう少し小さなテーブルが作れないものかと思います。

どこをどのようにすれば、テーブルを縦下を小さくできるのでしょうか？
（横幅に関してはこれで問題はないのですが・・・。）

教えてください！お願いします。

回答No.1

naokita · ベストアンサー

テーブルは、表なので、エクセルで作るような数値データなどでなければ利用しない方が良く、ワードで表示できるような文章などは、　HTMLのテーブルを利用すべきではないです。

提示のHTMLは、文法違反だらけなので、多少の修正では意図した表示はできません・・・
ウェブデザインは、CSSで描いた通りに自由に表現出来ますよ。但し、最低限でも文法を正しくする事

全部修正するなら以下の感じ。　小さくと言われてもどの程度か不明・・・
構想次第です。
貴方の原文ソースと比較しながら修正してみましょう。

<table border="1">
<tr><td class="timg"><a href=""><img src="" alt="" />リンクが二重になっているので１つ削除</a></td>
<td class="tdesc"><p style="color:#0000ff;"><a href="" target="_blank"><img src="" style="float: left;" /></a>文字</p>
<p style="clear: both;"><img src="" alt="" /><a href=""><strong style="font-size:18px;">文字</strong></p>
<p><a href="#">文字</a></p>
</td></tr>
<tr>
<th>文字</th><th>文字</th>
</tr>
<tr>
<td>文字円</td><td>文字円</td>
</tr>
</table>

CMSやブログなどでHTMLを記載するなら、複数行に改行せずに１行に書かないといけない仕様もあります。その場合は改行を削除する事。

回答No.2

naokita

訂正：
<p style="clear: both;"><img src="" alt="" /><a href=""><strong style="font-size:18px;">文字</strong></p>

閉じ忘れ　↓

<p style="clear: both;"><img src="" alt="" /><a href=""><strong style="font-size:18px;">文字</strong></a></p>