Edit in JSFiddle


              
<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;
}