html - 如何将 td 文本对齐到表格的左侧

Question

我在 JSP 文件中创建了一个表，如下所示：

JSP 代码：

<table style="width: 832px;" >
    <tr>
        <td style="width: 45px;text-align: left;" align="left"><%=episodeDate %></td>
        <td style="width: 7px;">&nbsp;</td>
        <td style="width: 257px;text-align: left;" ><%=careprovidername %></td>
        <td style="width: 7px;">&nbsp;</td>
        <td style="width: 260px;text-align: left;" ><%=docatorname %></td>
        <td style="width: 6px;">&nbsp;</td>
        <td style="width: 250px;text-align: left;"><%=purposeType %></td>
    </tr>
</table>

但我得到的是显示在下图中。

我的问题是第 5 个和第 7 个 td 数据没有很好地对齐。这段代码有什么问题？

Answer 1

在您的 JSP 中，您应该在一张表内循环。通过您的代码，您似乎正在重新设置可见代码之外的变量值。如果是这样，您将生成多个 1 行表。然后解决方法是在 <table> ...</table> 标记中设置您的 java 变量，为每个 java 对象创建新的 TR 和 TD。

使用单个表格，您的 TD 应该都按照您的意愿对齐。

<table style="width: 832px;" >
<%
MyObject o; // which has those variables
for (int i=0; i<array_size; ++i){
    o = array[i]; %>
    <tr>
        <td style="width: 45px;text-align: left;" align="left"><%= o.getEpisodeDate() %></td>
        <td style="width: 7px;">&nbsp;</td>
        <td style="width: 257px;text-align: left;" ><%= o.getCareproviderName() %></td>
        <td style="width: 7px;">&nbsp;</td>
        <td style="width: 260px;text-align: left;" ><%= o.getDocatorName() %></td>
        <td style="width: 6px;">&nbsp;</td>
        <td style="width: 250px;text-align: left;"><%= o.getPurposeType() %></td>
    </tr>
<% } %>
</table>

这里的想法是：

<table>
    <tr> <td></td>*7 </tr>
    <tr> <td></td>*7 </tr>
    <tr> <td></td>*7 </tr>
    <tr> <td></td>*7 </tr>
    <tr> <td></td>*7 </tr>
    <tr> <td></td>*7 </tr>
</table>

因此，设置 java 变量值的循环必须在 <table> ...</table> 标记内，而不是之前。

Answer 2

感谢Gintas K 的评论，我通过添加table-layout: fixed;样式解决了这个问题<table>。