Question

我有一个有15列的表，所以表看起来不整洁，列中的值在框中占用了超过1行

如何扩展表格宽度或将表格设置为其他内容，以便表格中的值看起来更整洁，只需使用方框的1行？

查看：

<table class="table">
    <tr>
        <th> a </th>
        <th> b </th>
        <th> c </th>
        <th> d </th>
        <th> e </th>
        <th> f </th>
        <th> g </th>
        <th> h </th>
        <th> i </th>
        <th> j </th>
        <th> k </th>
        <th> l </th>
        <th> m </th>
        <th> n </th>
        <th> o </th>
        <th>Actions</th>
    </tr> @foreach (var item in group) {
    <tr>
        <td> aa </td>
        <td> bb </td>
        <td> cc </td>
        <td> dd </td>
        <td> ee </td>
        <td> ff </td>
        <td> gg </td>
        <td> hh </td>
        <td> ii </td>
        <td> jj </td>
        <td> kk </td>
        <td> ll </td>
        <td> mm </td>
        <td> nn </td>
        <td> oo </td>
        <td> actions </td>
    </tr>
</table>

Answer 1

只需使用以下CSS

.table th, .table td {
    white-space: nowrap;
}

Answer 2

添加th和td white-space:nowrap属性。

更改表格宽度

2 个答案: