<div class="table-scroll">
    <table width="100%">
        <thead>
            <tr>
                <th>画像</th>
                <th>オリジナル</th>
                <th>91%</th>
                <th>85%</th>
                <th>81%</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>sample01.jpg</td>
                <td>582KB</td>
                <td>164KB</td>
                <td>128KB</td>
                <td>112KB</td>
            </tr>
            <tr>
                <td>sample02.jpg</td>
                <td>341KB</td>
                <td>89KB</td>
                <td>64KB</td>
                <td>55KB</td>
            </tr>
            <tr>
                <td>sample03.jpg</td>
                <td>398KB</td>
                <td>94KB</td>
                <td>72KB</td>
                <td>64KB</td>
            </tr>
            <tr>
                <td>sample04.jpg</td>
                <td>267KB</td>
                <td>54KB</td>
                <td>40KB</td>
                <td>34KB</td>
            </tr>
            <tr>
                <td>sample05.jpg</td>
                <td>518KB</td>
                <td>142KB</td>
                <td>111KB</td>
                <td>99KB</td>
            </tr>
        </tbody>
    </table>
</div>
<div class="table-scroll">
<table width="100%">
<thead>
<tr>
<th>画像</th>
<th>オリジナル</th>
<th>91%</th>
<th>85%</th>
<th>81%</th>
</tr>
</thead>
<tbody>
<tr>
<td>sample01.jpg</td>
<td>582KB</td>
<td>164KB</td>
<td>128KB</td>
<td>112KB</td>
</tr>
<tr>
<td>sample02.jpg</td>
<td>341KB</td>
<td>89KB</td>
<td>64KB</td>
<td>55KB</td>
</tr>
<tr>
<td>sample03.jpg</td>
<td>398KB</td>
<td>94KB</td>
<td>72KB</td>
<td>64KB</td>
</tr>
<tr>
<td>sample04.jpg</td>
<td>267KB</td>
<td>54KB</td>
<td>40KB</td>
<td>34KB</td>
</tr>
<tr>
<td>sample05.jpg</td>
<td>518KB</td>
<td>142KB</td>
<td>111KB</td>
<td>99KB</td>
</tr>
</tbody>
</table>
</div>
/* No context defined for this component. */

Default

幅の指定なし。内容によって幅が決まる

Full Width

コンテナの全幅で表示

Scrollable

自動でスクロール表示