css - 更改表格背景

Question

下面是提供的代码。目前，由于 span 标签，它正在突出显示文本。但我希望它更改该表值的背景颜色而不是突出显示文本。我该怎么做？

<c:choose>
  <c:when test="${manifest.manifestRtnedDate == null}">
    <td class="backgroundHighLight">
      <c:if test="${manifest.daysOpened >35 && manifest.daysOpened < 45 }">
        <span style="background-color: #FFFF00"><c:out value="${manifest.daysOpened }"/></span>
      </c:if>

      <c:if test="${manifest.daysOpened > 45 }">
        <span style="background-color: #FF4747"><c:out value="${manifest.daysOpened }"/></span>
      </c:if>
    </td>
  </c:when>
  <c:otherwise>
    <td>
      <c:out value="${ manifest.manifestRtnedDate}" />
    </td>
  </c:otherwise>
</c:choose>

Answer 1

您走在正确的轨道上，这里有两个选项。您可以:

1. 保持逻辑不变，并尝试添加 display: block;到你的 span 元素的样式。这应该让他们填写 <td>元素。或者……

2. 移动td元素本身进入 c:if block 并设置其背景样式而不是跨度(参见下面的示例)。

<c:choose>

  <c:when test="${manifest.manifestRtnedDate == null}">

    <c:if test="${manifest.daysOpened >35 && manifest.daysOpened < 45 }">
      <td class="backgroundHighLight" style="background-color: #FFFF00">
        <span><c:out value="${manifest.daysOpened }"/></span>
      </td>
    </c:if>

    <c:if test="${manifest.daysOpened > 45 }">
      <td class="backgroundHighLight" style="background-color: #FF4747">
        <span><c:out value="${manifest.daysOpened }"/></span>
      </td>
    </c:if>

  </c:when>

  <c:otherwise>
    <td>
      <c:out value="${ manifest.manifestRtnedDate}" />

    </td>
  </c:otherwise>
</c:choose>