BX Swiss Component Library

Table: Zebra

The label component is usually paired with a heading component and provides important meta information regarding the page or section.

<table class="table table--zebra">
    <thead>
        <tr>
            <th>All participants</th>
            <th>Trade vol. &lt; 60 TCHF reports (CHF)</th>
            <th>Trade vol. &gt; 60 TCHF volume (CHF)</th>
            <th>Trade vol. &gt; 1000 TCHF reports (CHF)</th>
            <th>Trade reports foreign instr. (CHF)</th>
            <th>Transaction reports (CHF)</th>
            <th>Non BX-listed Reports</th>
            <th>Total on invoice</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>Bird trading</td>
            <td>11 (16.50)</td>
            <td>0 (0.00)</td>
            <td>0 (0.00)</td>
            <td>45`566 (13`669.80)</td>
            <td>6`011 (1`803.30)</td>
            <td>0 (0.00)</td>
            <td>CHF 15`489.60</td>
        </tr>
        <tr>
            <td>VI Company</td>
            <td>0 (0.00)</td>
            <td>0 (0.00)</td>
            <td>0 (0.00)</td>
            <td>0 (0.00)</td>
            <td>1 (0.30)</td>
            <td>0 (0.00)</td>
            <td>CHF 0.30</td>
        </tr>
    </tbody>
    <tfoot>
        <tr>
            <td>Total</td>
            <td>11 (16.50)</td>
            <td>0 (0.00)</td>
            <td>0 (0.00)</td>
            <td>45`566 (13`669.80)</td>
            <td>6`012 (1`803.60)</td>
            <td>0 (0.00)</td>
            <td>CHF 15`489.90</td>
        </tr>
    </tfoot>
</table>
 
{{> '@element-table' class=(concat 'table ' modifier)}}
 
{
  "modifier": "table--zebra"
}