如何将 Asp MVC 表对象居中？

Question

所以我有一个基于 aspmvc 内置表视图的对象列表，它看起来像这样。

问题是，我希望所有元素都在中心对齐。代码非常通用，我相信是生成的代码。

<table class="table">
    <tr>
        <th>
            @Html.DisplayNameFor(model => model.m_EmailAddress)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.m_FirstName)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.m_LastName)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.m_CellNumber)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.m_CompanyName)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.m_CompanyAddress)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.m_CompanyState)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.m_CompanyZip)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.m_CompanyPhone)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.m_CompanyWebsite)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.m_WorkTravelRange)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.m_CompanyCostCode)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.m_CompanyAccountType)
        </th>
        <th></th>
    </tr>

@foreach (var item in Model) {
    <tr>
        <td>
            @Html.DisplayFor(modelItem => item.m_EmailAddress)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.m_FirstName)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.m_LastName)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.m_CellNumber)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.m_CompanyName)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.m_CompanyAddress)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.m_CompanyState)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.m_CompanyZip)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.m_CompanyPhone)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.m_CompanyWebsite)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.m_WorkTravelRange)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.m_CompanyCostCode)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.m_CompanyAccountType)
        </td>
        @*<td>
            @Html.ActionLink("Edit", "Edit", new { id=item.m_IdentityCode }) |
            @Html.ActionLink("Details", "Details", new { id=item.m_IdentityCode }) |
            @Html.ActionLink("Delete", "Delete", new { id=item.m_IdentityCode })
        </td>*@

我的直觉告诉我..

<table class = "table" align = "center">

而是要管用。

有人能指出我正确的方向吗？谢谢，麻烦您了。

编辑：

我试过了，<th text-align: center>但它看起来仍然是左对齐的。

Answer 1

您只需使用即可将样式应用于整个表格

.table th, .table td {
    text-align: center;
}

您可以将其包含在您的页面标记中...所以就在此之前 <table>

<style type="text/css">
    .table th, .table td {
        text-align: center;
    }
</style>
<table class="table">

或者您可以将代码放在您的布局或视图所引用的站点 css 文件中