css - 如何使用 TAL 创建斑马条纹 CSS？

Question

如何使用 Chameleon 或 Zope 页面模板轻松创建 CSS 斑马条纹？我想将 odd 和 even 类添加到表中的每一行，但使用条件 repeat/name/odd 或 repeat/name/even 即使使用条件表达式看起来也相当冗长:

<table>
   <tr tal:repeat="row rows" 
       tal:attributes="class python:repeat['row'].odd and 'odd' or 'even'">
       <td tal:repeat="col row" tal:content="col">column text text</td>
   </tr>
</table>

如果您要计算多个类，这会变得特别乏味。

Answer 1

repeat 变量的 Zope 页面模板实现有一个文档不足的 extra 参数，parity，它给你字符串 'odd' 或 'even'，在迭代之间交替:

<table>
   <tr tal:repeat="row rows" 
       tal:attributes="class repeat/row/parity">
       <td tal:repeat="col row" tal:content="col">column text text</td>
   </tr>
</table>

这也更容易插入到字符串表达式中:

tal:attributes="class string:striped ${row/class} ${repeat/row/parity}"

这也适用于 Chameleon。