<table class="fees-table table-bordered" data-toggle="table">
<thead>
<tr>
<th>
</th>
<th>
<label>DHL</label>
</th>
<th>
<label>DHL</label>
</th>
<th>
<label>Mallory</label>
</th>
<th>
</th>
<th>
</th>
<th>
</th>
<th>
</th>
<th>
</th>
</tr>
<tr>
<th>
</th>
<th>
<label>BOND</label>
</th>
<th>
<label>CQE/Non</label>
</th>
<th>
<label>Agave</label>
</th>
<th>
<label>Fees</label>
</th>
<th>
</th>
<th>
</th>
<th>
</th>
<th>
</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<label>Entry</label>
</td>
<td>
<input type="text" />
</td>
<td>
<input type="text" />
</td>
<td></td>
<td>
<label>Harbor Maintenance</label>
</td>
<td></td>
<td>
<input type="text" />
</td>
<td>
<label>%</label>
</td>
<td></td>
</tr>
<tr>
<td>
<label>ISF</label>
</td>
<td>
<input type="text" />
</td>
<td>
<input type="text" />
</td>
<td></td>
<td>
<label>Merch. Processing</label>
</td>
<td></td>
<td>
<input type="text" />
</td>
<td>
<label>%</label>
</td>
<td>
<input type="text" />
</td>
</tr>
<tr>
<td>
<label>FDA Notice</label>
</td>
<td>
<input type="text" />
</td>
<td>
<input type="text" />
</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td>
<label>Express Mail</label>
</td>
<td>
<input type="text" />
</td>
<td>
<input type="text" />
</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td>
<label>Disbursement</label>
</td>
<td>
<input type="text" />
</td>
<td>
<input type="text" />
</td>
<td></td>
<td>
<label>Mex Honey USDA</label>
</td>
<td></td>
<td>
<input type="text" />
</td>
<td>
<label>$</label>
</td>
<td>
<input type="text" />
</td>
</tr>
<tr>
<td>
<label>Avg 2 Customs Withdrawls</label>
</td>
<td>
<input type="text" />
</td>
<td>
<input type="text" />
</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td>
<label></label>
</td>
<td></td>
<td></td>
<td></td>
<td>
<label>Border Whse</label>
</td>
<td></td>
<td>
<input type="text" />
</td>
<td>
<label>$/PLT</label>
</td>
<td>
<input type="text" />
</td>
</tr>
<tr>
<td>
<label>Mexican Pre-Validation</label>
</td>
<td>
<input type="text" />
</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td>
<label>Mexican Customs</label>
</td>
<td></td>
<td></td>
<td>
<input type="text" />
</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td>
<label>US Customs</label>
</td>
<td></td>
<td></td>
<td>
<input type="text" />
</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td>
<label>Border Drayage</label>
</td>
<td></td>
<td></td>
<td>
<input type="text" />
</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td>
<label>Border Warehouse</label>
</td>
<td></td>
<td></td>
<td>
<input type="text" />
</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td>
<label>Blocking & Bracing</label>
</td>
<td></td>
<td></td>
<td>
<input type="text" />
</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td>
<label>Total</label>
</td>
<td>
<input type="text" />
</td>
<td>
<input type="text" />
</td>
<td>
<input type="text" />
</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
</tbody>
</table>
我的要求是,我希望2,3,4列应该可滚动,因为我想为此添加额外的列。我想要一个想法怎么做?使用表或网格系统n引导程序?
有什么建议吗?
表也应该响应。只有那3列才能与增加的额外列一起滚动?
最佳答案
使表响应式的结构如下
<div class="table-responsive">
<table class="table table-striped table-bordered">
// rest of the code
</table>
</div>
关于html - Bootstrap网格系统中的表,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/43894722/