html - Bootstrap glyphicon 作为按钮显示在 table 上

Question

我是整个 Bootstrap 的新手，所以即使我在过去 3 小时内尝试解决这个问题，我也做不到。我需要一个表格，在一个看起来像 glypicon 的单元格中有 2 个按钮(这样我以后可以向它们添加 javascript 函数)。我设法通过两种方式做到了这一点，但问题是这些按钮扩展了表格行很多。我该如何解决这个问题？也许制作按钮的替代方法？

这是表格现在的样子:

https://puu.sh/wbMUf/50a535e0f9.png

这里是用于实现第一行单元格结果的行:

<td>
    <p class = "btn"><span class = "fa fa-edit"></span></p>
    <p class = "btn"><span class = "fa fa-trash"></span></p>
</td>

第二行的单元格:

<td>
    <button type = "button" class = "btn btn-link"><span class = "fa fa-edit"></span></button>
    <button type = "button" class = "btn btn-link"><span class = "fa fa-trash"></span></button>
</td>

第二个选项不起作用，因为字形的样式必须与表中其余文本的样式相同。

Answer 1

你可以给 td width:10%; 或更少。

对于额外的空间，检查 css 中的 margin-top 和 margin-bottom。