โค้ด: เลือกทั้งหมด
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
โค้ด: เลือกทั้งหมด
<table class="table">
<thead>
<tr>
<th scope="col" ></th>
<th scope="col" >test04</th>
<th scope="col" >คนที่มองหา</th>
</tr>
</thead>
<tbody>
<tr>
<td>ออกกำลังกาย</td>
<td>ไม่ได้ออกกำลังกาย</td>
<td>ไม่มีคำตอบ</td>
</tr>
<tr>
<td>กีฬาที่ชอบ</td>
<td>เจ็ทสกี,ตะกร้อ</td>
<td></td>
</tr>
<tr>
<td>งานอดิเรก</td>
<td>ไม่มีคำตอบ</td>
<td></td>
</tr>
<tr>
<td >เล่นดนตรี เต้นรำ</td>
<td ></td>
<td ></td>
</tr>
</tbody>
</table>
โค้ด: เลือกทั้งหมด
<thead>
<tr>
<th scope="col" ></th>
<th scope="col" >test04</th>
<th scope="col" >คนที่มองหา</th>
</tr>
</thead>
โค้ด: เลือกทั้งหมด
<tr>
<td>ออกกำลังกาย</td>
<td>ไม่ได้ออกกำลังกาย</td>
<td>ไม่มีคำตอบ</td>
</tr>
ผลลัพธ์
หากต้องการที่จะเรียนรู้ css เพิ่มเติม ด้วย bootstrap วิธีการสร้าง nav-tabs โดย bootstrap viewtopic.php?f=76&t=67936 สามารถดูวิธีการทำอื่นๆ มากมายได้จาก Booststap Knowledge viewforum.php?f=76