如何在html中最小化表格中的列宽？
如何在html中最小化表格中的列宽？
提问于 2018-07-17 02:10:45
我有一张这样的桌子
但是我希望options列像这样小
代码(使用bootstrap 4的即时通信)：
<table class="table table-bordered table-hover">
<thead class="table-primary">
<tr class="text-center">
<th scope="col">#</th>
<th scope="col">Nom</th>
<th scope="col" colspan="2">Options</th>
</tr>
</thead>
<tbody class="table-light">
<tr class="text-center">
<th scope="row"><?php echo $donnees[0]; ?></th>
<td><?php echo $donnees[1]; ?></td>
<td><a href="#"><img src="res\images\edit-icon.svg" height="30x" title="modifier"></a></td>
<td><a href="#"><img src="res\images\delete-icon.svg" height="30x" title="supprimer"></a></td>
</tr>
</tbody>
</table>
回答 1
Stack Overflow用户
回答已采纳
发布于 2018-07-17 02:35:36
一个非常简单的解决方案是将options头的width设置为1%。宽度将为1%，如果内容较大，则为内容的大小。如下所示：
<table class="table table-bordered table-hover">
<thead class="table-primary">
<tr class="text-center">
<th scope="col">#</th>
<th scope="col">Nom</th>
<th scope="col" colspan="2" width="1%">Options</th>
</tr>
</thead>
<tbody class="table-light">
<tr class="text-center">
<th scope="row"><?php echo $donnees[0]; ?></th>
<td><?php echo $donnees[1]; ?></td>
<td><a href="#"><img src="res\images\edit-icon.svg" height="30x" title="modifier"></a></td>
<td><a href="#"><img src="res\images\delete-icon.svg" height="30x" title="supprimer"></a></td>
</tr>
</tbody>
</table>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/51367808
复制相关文章
相似问题