<template>
<div class="tab-wrap">
<table>
<colgroup>
<col width="20%" />
<col width="40%" />
<col width="40%" />
</colgroup>
<thead>
<tr>
<th scope="col">구분</th>
<th scope="col">태블릿</th>
<th scope="col">스마트폰</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">상반기 판매수</th>
<td>20,000</td>
<td>50,000</td>
</tr>
<tr>
<th scope="row">하반기 판매수</th>
<td>30,000</td>
<td>110,000</td>
</tr>
</tbody>
<tfoot>
<th scope="row">total</th>
<td>50,000</td>
<td>160,000</td>
</tfoot>
</table>
</div>
</template>
<script>
export default {};
</script>
<style scoped>
table {
width: 100%;
}
tfoot td {
text-align: center;
}
tbody tr td {
text-align: center;
}
</style>