Data Table
ตารางข้อมูล responsive สำหรับงบการเงิน ข้อมูลผู้ถือหุ้น
Default (Striped)
Previewdata-table-default
<section class="stk-section"> <div class="container"> <h2 class="stk-heading text-center mb-5">ข้อมูลทางการเงิน</h2> <div class="stk-table-wrapper"> <table class="stk-table stk-table--striped"> <thead> <tr> <th>รายการ</th> <th class="text-end">2568</th> <th class="text-end">2567</th> </tr> </thead> <tbody> <tr> <td>รายได้รวม (ล้านบาท)</td> <td class="text-end">1,500</td> <td class="text-end">1,200</td> </tr> </tbody> </table> <p class="stk-table__caption">หมายเหตุ: ตัวเลขผ่านการตรวจสอบแล้ว</p> </div> </div></section>Props
| Field | Type | Required | Description |
|---|---|---|---|
title | string | ✓ | หัวข้อ section |
headers | string[] | ✓ | หัวตาราง |
rows | string[][] | ✓ | ข้อมูลแต่ละแถว |
caption | string | - | หมายเหตุใต้ตาราง |
CSS Classes
.stk-table-wrapper /* responsive scroll wrapper */.stk-table /* table base */.stk-table--striped /* alternating row colors */.stk-table--bordered /* all borders */.stk-table__caption /* footnote below table */