テーブルで

0   名前： ヤコ ： 2006/10/20（金） 17:26  ID:DwB2M88t
テーブルタグをレイアウトに使っているのですが、テーブルの上下に隙間が出来ないようにはできますか？
背景に画像を入れ、黒いテーブルで縦に帯のようにしたいのですが…(最悪スクロールできなくてもかまいません)

よろしければご指導お願いいたします。
1   名前： 点心 ： 2006/10/20（金） 17:26  ID:ad3gQF35
基本的に、table要素同士が間に何も挟まず連続で配置されていた場合は、上下に
隙間は出来なかったと思います。
もう少し詳しく状況を教えて頂ければお答えできるかもしれません。

取りあえず、スタイルシートは未使用として考えられる原因です。
・td要素の中にtable要素を入れている。

対処法
・そのtable要素を含んでいるtable要素に cellspacing="0" cellpadding="0" を
　指定する。

<table cellspacing="0" cellpadding="0">
2   名前： masao ： 2006/10/20（金） 17:26  ID:MN7JUJxS
テーブル(セルではありません)の隙間をなくすには、table要素に
CSSの、 margin: 0; padding: 0 を指定すればできると思います。
ページの背景を帯のように表示したいのだったら、headタグの間に、
<style type="text/css"><!--
body {
background-image: url(画像のURL);
background-repeat: repeat-y;
background-color: black }
--></style>

と書き込めばできます。
HTML質問版なのにCSSに話題がずれてすみません。
3   名前： ヤコ ： 2006/10/20（金） 17:26  ID:DwB2M88t
すみません、言葉不足でした；

テーブルの上下に隙間というのは、本来テーブルは表としてのものなので、

┌────────┐
│┌──────┐│
││　　　　　　　　　││
││　　　　　　　　　││ 外側…背景
││　　　　　　　　　││ 内側…テーブル
││　　　　　　　　　││
││　　　　　　　　　││
│└──────┘│
└────────┘

というように、なってしまいますよね？
それを、

┌┬──────┬┐
││　　　　　　　　　││
││　　　　　　　　　││
││　　　　　　　　　││
││　　　　　　　　　││
││　　　　　　　　　││
││　　　　　　　　　││
││　　　　　　　　　││
└┴──────┴┘

というように、上や下に背景が表示されないようにべったりと黒いテーブルを貼りたいのです。

これは、やはりタグでは無理なのでしょうか？
分かりづらくてすみません、お願いします。
4   名前： カヅサツ ◆ThCi95HEzw ： 2006/10/20（金） 17:26  ［URL］  ID:O5hEMlpW
>>3
> (略)
> というように、上や下に背景が表示されないようにべったりと黒いテーブルを貼りたいのです。
> これは、やはりタグでは無理なのでしょうか？

無理ではありませんが、オススメしません。
色やレイアウトの類は、スタイルシートで行いましょう。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
	"http://www.w3.org/TR/html4/strict.dtd">
<html lang="ja" dir="ltr">
<head>
<title></title>
<style type="text/css">
body,html{
	height: 100%;
	margin: 0px;
	padding: 0px;
}
body{
	color: #000000;
	background-color: #CCCCFF;
}
table#examination{
	color: #FFFFFF;
	background-color: #000000;
	height: 100%;
	width: 50%;
	margin: 0px auto;
	border-collapse: collapse;
}
table#examination,
table#examination th,
table#examination td{
	border-width: 1px;
	border-style: solid;
	border-color: #FFFFFF;
}
</style>
</head>
<body>
<table summary="第1回試験" id="examination">
	<thead>
		<tr>
			<th scope="col">名前</th><th scope="col">得点</th>
		</tr>
	</thead>
	<tbody>
		<tr>
			<th scope="row">出木杉英才</th><td>100</td>
		</tr>
		<tr>
			<th scope="row">野比のび太</th><td>0</td>
		</tr>
	</tbody>
</table>
</body>
</html>


上記サンプルでわからない点がもしあれば、総合質問板かCSS板に移動してください。
どうしても「タグ」以外でやりたくないなら、この私の投稿は無視してください。
5   名前： ヤコ ： 2006/10/20（金） 17:26  ID:DwB2M88t
>>4
回答ありがとうございます。
そのまま貼り付けてみたところ、無事出来ました。
しかし、CSSについては(タグもですが…)全くの初心者なので、細かいところを変えると表示されなくなったりと四苦八苦です；

けれども、とりあえずやり方だけは何とか分かったので、色々と試してみます。
詳しい説明、本当にありがとうございました！
一覧へ戻る