Beispiel:CSS grundlagen nth-child.html
Aus SELFHTML-Wiki
<!doctype html>
<html lang="de">
<head>
<meta charset="utf-8">
<title>Pseudoklasse :nth-type()</title>
<style>
table { border-collapse: collapse; }
td { width: 30px; height: 30px; border: thin solid; }
tr:nth-child(odd) td:nth-child(odd) {background: black;}
tr:nth-child(even) td:nth-child(even) {background: black;}
</style>
</head>
<body>
<h1>Schachbrettmuster mit Pseudoklasse <code>:nth-type()</code></h1>
<table>
<tbody>
<tr><th>8</th><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr><th>7</th><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr><th>6</th><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr><th>5</th><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr><th>4</th><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr><th>3</th><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr><th>2</th><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr><th>1</th><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr><th></th><th>A</th><th>B</th><th>C</th><th>D</th><th>E</th><th>F</th><th>G</th><th>H</th></tr>
</tbody>
</table>
</body>
</html>
