HTMLでテーブルを作成すると上に大きなスペースが空いてしまいます。

締切済

質問者：jill10
質問日時：2010/09/29 14:29
回答数：3件

HTMLでテーブルを作成すると上に大きなスペースが空いてしまいます。
色々ネットで検索して他の方がおっしゃる通りためしてみたのですができなくて困っています。
できないのは下記の二点です。
間違ってるところがあればご教授下さい。

1. <table width=600 border="5" bgcolor=#FFC0CB>

2. <table width=800 border=0 cellpadding=30 cellspacing=0 bgcolor=#FFB6C1><tr> <td width=0%><br></td></tr><tr> <td width=0%><br></td> <td align=left> <font color=#696969 size=3>

よろしくお願いしますm(__)m

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (3件)

最新から表示
回答順に表示

No.3

回答者： chile5583
回答日時：2010/10/02 23:54

回答番号：No.2　で一度回答したものです。

あまりHTMLをわかっていらっしゃらないということですが、
簡単に言えば、１のタグに空間ができるようなタグは入っていません。

２のタグは

<td width=0%><br></td>

という意味不明なタグが入っていますのでこれは不要です。tdタグがあるのに<br>(改行)タグだけがありますから、おそらくこの<br>タグが入ったtdタグがたくさんあるんじゃないでしょうか？

２のタグを正しく書くなら、

<table width=800 border=0 cellpadding=30 cellspacing=0 bgcolor=#FFB6C1>
<tr>
<td align=left>
<font color=#696969 size=3>テスト</font>
</td>
</tr>
</table>

こうならないといけないです。

cellpadding=30　と設定してありますので、テストという文字の周り（正確にはtdの枠の内側）に30pxの余白が上下左右にできます。

この余白をなくしたいなら、下記のようにcellpaddingの数字を減らせば行を増やしてもよけない余白が目立たなくなります。

<table width=800 border=0 cellpadding=5 cellspacing=0 bgcolor=#FFB6C1>
<tr>
<td align=left>
<font color=#696969 size=3>テスト</font>
</td>
</tr>
<tr>
<td align=left>
<font color=#696969 size=3>テスト</font>
</td>
</tr>
<tr>
<td align=left>
<font color=#696969 size=3>テスト</font>
</td>
</tr>
</table>

最初に回答したところの補足を読むと<head>タグがわからないとのことですが、HTMLの基礎ですので間違ったタグでめちゃくちゃなサイトを作らないように、最初のうちに基礎を勉強しておいた方が良いかもしれません。

<html><head><body>最初に覚えるHTMLタグはこの3つだとおもうのですが、これが分からないのにtableタグを使うと、もっと混乱してしまいます。

HTMLの基本
http://www.htmq.com/htmlkihon/004.shtml

書いたHTMLが正しいかどうかを採点してくれるサイトもあります。（かなり基礎ができていないと厳しいです）
http://openlab.ring.gr.jp/k16/htmllint/htmllint. …

がんばってください。