Question

在我的ASP.NET MVC Core 1.1应用程序的以下View表中，我尝试在列OrderNumber和ItemName之间创建一些空格。但是这两列的内容仍然太接近了。是因为我css内的<style>....</style>错误，或者表格的Bootstrap默认设置是否覆盖了我的css。问题：如何在两列之间创建间距？

@model MyProj.Models.TestViewModel
<style>
    table th td{
        padding-left:115px;
    }
</style>
<table>
    @foreach (var item in Model.lstOrders)
    {
        <tr>
            <td>
                <a asp-action="TestAction" asp-route-id="@item.OrderId">@item.OrderNumber</a>
            </td>
            <td>
                @item.ItemName
            </td>
        </tr>
    }
</table>

Answer 1

你可以：

为CSS中的元素定义填充（推荐）
在两者之间插入一个空列，并使用＆＃39;＆amp; nsbp＆＃39;价值（讨厌的黑客，但证明有效）

...并且您的样式定义错误（提示：表中没有元素）。试试吧

td {
    padding: 5px;
}

Answer 2

你的CSS：

table th td {
    padding-left:115px;
}

表示：

为每个td的{{1}}孩子提供th的孩子，左边填充为115px。

相反，你想要做的是：

table

表示每个table th, table td { padding-left:115px; }和th左边填充115px。

列之间的ASP.NET Bootstrap表填充不起作用

2 个答案: