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

解決済みの質問

スタイルシートのテーブル枠について

今までテーブルを利用してホームページに簡単な線を
つけていました。これをスタイルシートで行うと
微妙にうまくできません・・・お助けください。

すべてIEで検査しております。

html従来の私の線の引き方
<table width="600" border="0" cellspacing="0" cellpadding="0">
<tr>
<td bgcolor="#000000">
<img src="sps.gif" width="600" height="1">
</td>
</tr>
</table>

上記の表現をスタイルシートを利用してやりたいのですが
線が1pxのはずが、大きくなってしまいます。

cssを利用した記述
css部分
.index_table{
width: 600px;
border:0px;
border-width: 0px;
margin: 0px;
padding: 0px;
}

html部分
<table class="index_table">
<tr>
<td bgcolor="#000000">
<img src="ims/sps.gif" width="600" height="1">
</td>
</tr>
</table>

これに似たいい方法は、ないでしょうか?
質問が、うまくまとまってなくてすみません・・・

投稿日時 - 2006-03-16 04:17:11

QNo.2032025

困ってます

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

<td bgcolor="#000000">
<img src="ims/sps.gif" width="600" height="1">
</td>

上の部分は画像で線を表示しているということですよね?
画像は使わずに、上の「td」に適用するクラスを作成してborder-topプロパティで枠線を上部だけに表示させればいいのでは?

CSS例:
td.クラス名 {
border-top: solid 1px #fff; /* ←枠線色は任意に変更して下さい */
background-color: #000;
}

HTML例:
<td class="クラス名">

</td>

投稿日時 - 2006-03-17 14:11:59

お礼

ご回答ありがとうございます。

なるほど、TDのクラス設定をしテーブルクラスの
ほかにTDクラスを作りsolidで線を付けるやり方
ですね^^

投稿日時 - 2006-03-19 08:03:54

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

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

回答(2)

ANo.1

テーブルのCSSに
border-collapse:collapse;
border-spacing: 0px 0px;
を追加してみてください。

投稿日時 - 2006-03-16 09:41:11

お礼

ご回答ありがとうございます。

上記を追加してみたのですが、うまく表示されないようです

投稿日時 - 2006-03-16 16:28:50

あなたにオススメの質問