如何使用TAL创建斑马条纹CSS?

前端之家收集整理的这篇文章主要介绍了如何使用TAL创建斑马条纹CSS?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
如何使用Chameleon或Zope页面模板轻松创建CSS斑马条纹?我想在表中的每一行添加奇数和偶数类,但使用一个条件重复/名称/奇怪或重复/名称/甚至看起来相当冗长,即使有条件表达式:
<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>

如果你有多个类来计算,这会变得特别乏味。

解决方法

重复变量的Zope页面模板实现具有一个欠缺的额外参数,奇偶校验,比给出字符串’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以及。

猜你在找的CSS相关文章