Stylování tabulek v css

Pohodlné a efektní ostylování řádků tabulky se nemusí dělat přes javascript, ale pomůže css. Vložte do css následující:

.tigra {
    border-collapse: collapse;
    margin: 0 auto;
}
.tigra th {
    padding: 0 3px;
}
.tigra td {
    vertical-align: middle;
}
.tigra tbody tr:nth-child(odd) {
    background: #e6eaeb;
}
.tigra tbody tr:nth-child(even) {
    background: #ffffff;
}
.tigra tbody tr:nth-child(2n+1):hover {
    background: #C3CCD0;
}
.tigra tbody tr:nth-child(2n):hover {
    background: #C3CCD0;
}

A pak v html dejte tabulku do třídy „tigra“.

<table class="tigra">
<thead>
<tr><th>sloupec 1</th><th>sloupec 2</th></tr>
</thead>
<tbody>
<tr><td>řádek 1</td><td>řádek 1</td></td>
<tr><td>řádek 2</td><td>řádek 2</td></td>
</tbody>
</table>

Load jQuery

Pokud používáte jQuery knihovnu, je vhodnější ji tahat z nějakého repozitáře. Jquery nabízí např. google.

Do stránky tedy vložte kód:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script>
if (!window.jQuery) {
document.write('<script src="/path/jquery.min.js"><\/script>');
}
</script>

A do lokálního adrersáře na vašem serveru si knihovnu stáhněte také (/path/jquery.min.js), a v případě, že se knihovnu nepodaří z googlu načíst, načte se z lokálu.