[CSS]<tr>でborderを使えるようにする方法

CSS

2014.02.19

<table>の<tr>タグにCSSのborderを適用させる方法のご紹介です。

<table>にborder-collapse:collapseを指定

<table>タグに border-collapse:collapseを指定することで、<tr>にborderが適用されます。

CSSはこのような感じで、

table 	{
	border-collapse:collapse
}
table tr	{
	border:1px solid #dedede;
}

table {

border-collapse:collapse

}

table tr {

border:1px solid #dedede;

}

HTML側はこのような感じにします。

<table>
<tbody>
<tr>
<td>項目</td><td>trにborderを指定する</td>
</tr>
<tr>
<td>項目</td><td>trにborderを指定する</td>
</tr>
<tr>
<td>項目</td><td>trにborderを指定する</td>
</tr>
<tr>
<td>項目</td><td>trにborderを指定する</td>
</tr>
<tr>
<td>項目</td><td>trにborderを指定する</td>
</tr>
</tbody>
</table>