如何使用JSTL交替表格行背景颜色？

Question

如何使用两种不同的颜色交替显示表格行，但需要将标题行显示为另一种颜色。是否可能？我需要使用循环技术。 哦，不，我不能发布图片。但它看起来像一个有5行的表格，标题行是蓝色的，而其他4行是红色、白色、红色、白色。

- tim

---

描述有点模糊。你能否在问题中添加一个小的HTML表格，展示你需要什么？ - Thorbjørn Ravn Andersen

Answer 1

使用带有 varStatus 和几行 CSS 的 <c:forEach>。

<table>
    <thead>
        <tr>
            <th>header1</th>
            <th>header2</th>
            <th>header3</th>
        </tr>
    </thead>
    <tbody>
        <c:forEach items="${bean.list}" var="item" varStatus="loop">
            <tr class="${loop.index % 2 == 0 ? 'even' : 'odd'}">
                <td>${item.property1}</td>
                <td>${item.property2}</td>
                <td>${item.property3}</td>
            </tr>
        </c:forEach>
    <tbody>
</table>

使用CSS

tr.even { background: red; }
tr.odd { background: white; }

在上面的例子中，表头只是与正文部分分离开来。当正文中表格行索引为2的倍数（即偶数）时，它会得到 class="even"，否则会得到class="odd" （在浏览器中打开页面，右键点击并选择 查看页面源代码 以查看自己）。使用CSS，您可以轻松控制单个元素的样式。要给表头行添加蓝色背景，只需添加以下内容：

thead tr { background: blue; }

- BalusC