HTMLで作成したTableの行(tr)ごとに枠色を変えたいと思っています。
しかし現状では各行のborder-top-colorが、
1つ前の行のborder-bottom-colorで上書きされているように表示されてしまいます。
きちんと各行を希望の色で囲んで表示するにはどうすればよいでしょうか?
ご存知の方がいらっしゃいましたら、ご教授お願い致します。
<このように表示したい>
※以下のイメージでは行と行のに隙間がありますが、理想は隙間がなく表示したいです。
![イメージ説明]WIDTH:348
<現状の表示>
![イメージ説明]WIDTH:362
lang
1<!DOCTYPE html> 2<html lang="ja"> 3<body> 4 <table> 5 <tr class="black"><td>あ</td><td>い</td><td>う</td></tr> 6 <tr class="red"><td>か</td><td>き</td><td>く</td></tr> 7 <tr class="black"><td>さ</td><td>し</td><td>す</td></tr> 8 </table> 9</body> 10</html> 11 12<style type="text/css"> 13table { 14 border: 1px #000 solid; 15 border-collapse: collapse; 16} 17 18tr.black { border: 1px #000 solid; } 19tr.red { border: 1px #F00 solid; } 20--> 21</style>
回答2件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2015/04/09 06:56
2015/04/09 07:04