c:forEach在單個表格行中顯示所有內容

目前我正在做一個專案，我需要在我的資料庫的列中顯示資訊，但由于某種原因，它們顯示在一行中。現在顯示如下所示：

我還附上了我的 jsp 頁面中的代碼：

<table border="1"
       cellspacing="0" cellpadding="3"
       style="font-size: small; line-height: 100px; border-color: #D1EEEE">
    <tr bgcolor="#DCDCDC" align="left" style="border-color: #838B83">
        <th width="250px">Discipline</th>
        <th width="100px">Mark</th>
    </tr>

    <c:forEach items="${Disc}" var="Dis">
        <td style="padding-bottom: 20px">${Dis.discipline}</td>
        <td style="padding-bottom: 20px">0</td>
    </c:forEach>

    <td/>
</table>

這是如何引起的，我該如何解決？

uj5u.com熱心網友回復：

我設法找到了解決方案——這很明顯。有必要： 將<tr>和添加</tr>到回圈中。去除晦澀<td/>。

               <table>
                    <tr>
                        <td style="padding: 50px 0 0 0">
                            <table border="1"
                                   cellspacing="0" cellpadding="3"
                                   style="font-size: small; line-height: 100px; border-color: #D1EEEE">
                                <tr bgcolor="#DCDCDC" align="left" style="border-color: #838B83">
                                    <th width="250px">Discipline</th>
                                    <th width="100px">Mark</th>
                                </tr>


                                    <c:forEach items="${Disc}" var="Dis">
                                <tr>
                                <td style="padding-bottom: 20px">${Dis.discipline}</td>
                                        <td style="padding-bottom: 20px">0</td>
                                </tr>
                                </c:forEach>
                                
                            </table>

uj5u.com熱心網友回復：

Boostrap 不是一個壞主意（在 Bhola Galy 的回答中提到并鏈接）。但是，如果您出于某種原因肯定需要使用表格，請知道它<tr>代表“表格行”。標簽和結束標簽包含一個<td>資料單元格。A<th>是表頭。

MDN 關于表基礎的文章很有用。

不確定這是否正是您的意思，但在下面我添加了<tr>s 將您可能想要的內容包裝成一行。在單個<tr>中，放置在那里的元素將排成一行。

此示例只是您的代碼片段的一個子集，但可能會顯示原理。

<table cellspacing="0">
    <tr>
        <td>
            <table border="1" cellspacing="0" cellpadding="3"
                style="font-size: small; line-height: 25px; border-color: #D1EEEE">
                <tr>
                    <th>Name</th>
                    <td style="vertical-align: middle;">(Name here)</td>
                </tr>
                <tr>
                    <th>Surname</th>
                    <td style="vertical-align: middle;">(Surname here)</td>
                </tr>
                <tr>
                    <th>Group</th>
                    <td style="vertical-align: middle;">(Group here)</td>
                </tr>
                <tr>
                    <th>Date of enrollment</th>
                    <td style="vertical-align: middle;">(Date here)</td>
                </tr>

            </table>
        </td>
    </tr>
</table>

大多數互聯網用戶使用的設備螢屏尺寸差異很大。默認情況下，Bootstrap 承認需要對不同的螢屏尺寸做出回應。

標籤：jsp html表 jstl

上一篇：如何在JSP中為字串結果著色？

下一篇：如何在jstl中從double轉換為int？