<table id="table1"> <caption align="bottom">border-collapse: collapse</caption> <tr> <th>データ1</th> <td>りんご</td> </tr> <tr> <th>データ2</th> <td>ゴリラ</td> </tr> <tr> <th>データ3</th> <td>ラッパ</td> </tr> </table> <table id="table2"> <caption align="bottom">border-collapse: separate</caption> <tr> <th>データ1</th> <td>りんご</td> </tr> <tr> <th>データ2</th> <td>ゴリラ</td> </tr> <tr> <th>データ3</th> <td>ラッパ</td> </tr> </table>
table { margin: 20px; } #table1 { border-style: solid; border-radius: 10px; border-collapse: collapse; } #table2 { border-style: solid; border-radius: 10px; border-collapse: separate; }