通过XSL交替行颜色的HTML表

前端之家收集整理的这篇文章主要介绍了通过XSL交替行颜色的HTML表前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
HTML表(a.ka.条带化)中替换行颜色的最简单方法是什么?我的大多数表都是用XSL模板创建的,如下所示,在另一个模板中定义了表,thead等.
<xsl:template match="typ:info">
  <tr>
    <td>
      <xsl:value-of select="typ:dateAccessed" />
    </td>
    <td>
      <xsl:value-of select="typ:loginId" />
    </td>
  </tr>
</xsl:template>

我的偏好是在元素上使用交替的类.

解决方法

如果您必须在HTML中生成硬编码的颜色:
<xsl:template match="typ:info">
  <xsl:variable name="css-class">
    <xsl:choose>
      <xsl:when test="position() mod 2 = 0">even</xsl:when>
      <xsl:otherwise>odd</xsl:otherwise>
    </xsl:choose>
  </xsl:variable>
  <tr class="{$css-class}">
    <td>
      <xsl:value-of select="typ:dateAccessed" />
    </td>
    <td>
      <xsl:value-of select="typ:loginId" />
    </td>
  </tr>
</xsl:template>

使用今天的浏览器,您使用CSS和tr:nth-​​child(奇数)更好.

这导致XSLT方面的麻烦更少,更清晰的HTML标记,并且它与客户端表排序和过滤兼容.

原文链接:https://www.f2er.com/html/230129.html

猜你在找的HTML相关文章