<tr>タグにCSSでborder-bottomを設定することで、
テーブルの一行ごとに下線を引きたいのですが、どうしたらよいでしょうか。

<tr>タグにはborderを設定できないのでしょうか？

18pt

一行ごとというのは、ノートのような罫線を引きたいということでしょうか？

border-bottomでtrに設定しても、テーブルのセルごとの下部に線がつくだけですので罫線のような効果は得られないと思います。

http://iswebmag.hp.infoseek.co.jp/sample203.html

こちらにあるように、罫線ぽい背景画像を用意し、それにあわせてfont-sizeやline-heightを設定すれば罫線ぽくなりますよ。薄いグレーの細めの線でそういったものを作っているサイトが多いように見受けられます。

17pt

trではなく、tdにborder-bottomを設定したらどうでしょう。

ＩＥ6.0では出ますが、ほかのブラウザはうまくいかないかもしれません。

http://q.hatena.ne.jp/1185250345

17pt

http://msugai.fc2web.com/web/tips/tableborder.html

<table frame="below" rules="rows">
<tr><td>123</td><td>いろは</td><td>ＡＢＣ</td></tr>
<tr><td>123</td><td>123</td><td>123</td></tr>
</table>

こんなのはダメですか？

17pt

http://www.w3.org/TR/CSS21/tables.html#borders

http://hp.vector.co.jp/authors/VA022006/css/tables.html#border-c...

CSS2.1の仕様では、table要素のborder-collapseプロパティがcollapseの場合のみ、tr要素のborderプロパティが有効なようです。

（border-collapseプロパティのデフォルトはseparate）

FireFoxはこれを忠実に実装しており、下記ソースで下線が表示されます。

border-collapseを省略、またはseparateにすると下線は出ません。

<style>
table.note {
  border-collapse:collapse;
}
table.note tr {
  border-bottom: 1px solid red;
}
</style>
<table class="note">
  <tr>
    <th><p>aaaa</p></th><td><p>bbb</p></td>
  </tr>
  <tr>
    <th><p>aaaa</p></th><td><p>bbb</p></td>
  </tr>
  <tr>
    <th><p>aaaa</p></th><td><p>bbb</p></td>
  </tr>
</table>

IEでの実装がはっきりしませんが、どうもtrのborderは一切効かないようです

（style自体が効かないわけではない、height、backgroundなど効果のあるプロパティはいくつもある）

----

以下、IE用の参考。

<style>
table.note {
  border-collapse:collapse;
}
table.note th, table.note td {
  padding:0em;
  border-bottom: 1px solid red;
}
</style>

17pt

> 最悪tdですが、無理ということがはっきりしない限りはtrでの方法が知りたいです。

FirefoxやOperaなど対応環境ではborder-collapseプロパティにcollapceを適用するとtr要素に指定されたborder-styleが反映されますが、IE6ではborder-styleがtr要素に適用されません。

また、対応ブラウザでも表示に差異の生じるケースがあるようですので現状だと使うのは好ましくないでしょう。

http://www.zspc.com/documents/css2/box/borderstyle.html

table {
border-collapse:collapse;
}
tr {
border-bottom:1px #00FF00 solid;
}

17pt

http://www.tagindex.com/kakolog/q3bbs/1/92.html

1で回答したものです。

質問の意味を取り違えていたようで申し訳ない。

上のURLを参照するところ、現在WinIEではtrにborderはつかないそうです。ただし別の方法で似たような見た目にすることは出来るようです。

1.

th, td { border-bottom: 1px solid #555; }

2.

table { border-collapse: collapse; }

を指定したうえで、

＜table frame="hsides" rules="rows"＞

何度もすみませんでした。

参考になれば。

17pt

tableに border-collapse: collapse を指定します。

style要素や外部ファイルに各場合は次のように。

table {
  border-collapse: collapse;
}

tr {
  border-bottom: 1px solid black;
}

style属性を使う場合は次のように。

<table style="border-collapse: collapse;">
<tr style="border-bottom: 1px solid black;">
  <td></td>
</tr>
</table>

で思い通りになるかと思います。

http://q.hatena.ne.jp/