css - asp.net mvc 如何让表头居中对齐？

Question

这是我在 asp.net mvc 中的表的代码。

<div class="span4 proj-div text-center" data-toggle="modal" data-target="#addLanguageModal">
<u>Add Language</u>
<table class="table table-bordered table-dark-header table-responsive">
    <tr class="text-center">
        <th>Language Name</th>
        <th>Welcome Message</th>
        <th></th>
    </tr>


    @foreach (var item in Model.Languages)
    {
        <tr>
            <td>@Html.DisplayFor(modelItem => item.LanguageName)</td>
            <td>@Html.DisplayFor(modelItem => item.Message)</td>
            <td>
                @Html.ActionLink("Edit", "EditLanguage", "Country", new { id = item.LanguageId })|
                @Html.ActionLink("Delete", "DeleteLanguage", "Country", new { id = item.LanguageId })
            </td>
        </tr>
    }
</table>

屏幕喜欢:

您会看到标题在左侧。我希望标题文本位于中心。我们可以使用 Bootstrap 类来做到这一点吗？

Answer 1

向每个 th 添加类名 class="text-center"。

或者在你的 CSS 中:

th {
  text-align: center;
}

Bootstrap documentation - alignment classes