Luminate CMS: How to make a striped list or table?

striped-list-table.html

<style>
div.odd { background: #eee; }
div.even { background: #fff; }
</style>

<div class="striped">
    <t:list>
        <t:if test="index%2 == 1"><div class="odd"></t:if>
        <t:else><div class="even"></t:else>
        ${title}
        </div>
    </t:list>
</div>

<style>
table.striped { border-collapse: collapse; border: 1px solid #ddd;}
table.striped tr.odd { background: #eee; }
table.striped tr.even { background: #fff; }
table.striped td { border: 1px solid #ddd; padding: 5px; }
</style>

<table class="striped"><tbody>
    <t:list>
        <t:if test="index%2 == 1"><tr class="odd"></t:if>
        <t:else><tr class="even"></t:else>
        <td>${title}</td>
        <td>${description}</td>
        </tr>
    </t:list> </tbody>
</table>