sfondo tabella più colori

**gian21** · 26-05-2014, 11:09

Allora ragazzi ho una tabella che sarebbe una classifica di calcio dove ho dal 1 fino al 20 posto vorrei tramite il ciclo che mi va a stampare tutte le squadre comporre in base alla posizione uno sfondo Diverso per esempio il primo verde il secondo giallo e poi il 20 rosso come posso fare ?

**KillerWorm** · 26-05-2014, 18:00

Allora puoi usare il selettore nth-child().

Esempio pratico:

codice:

<!DOCTYPE HTML>
<html>
  <head>
    <title>Esempio</title>
    <meta charset="utf-8">
    <style type="text/css">
      table{
        width:300px;
        border-collapse:collapse;
      }
      table tr td{
        border:1px solid Grey;
      }
      table tr{ /* tutte le altre righe */
        background:Beige;
      }
      table tr:nth-child(1){ /* la prima riga */
        background:Green; 
      }
      table tr:nth-child(2){ /* la seconda riga */
        background:Yellow;
      }
      table tr:nth-child(20){ /* la ventesima riga */
        background:Red;
      }
    </style>
  </head>
  <body>
    <table>
      <tr><td>1</td><td></td></tr>
      <tr><td>2</td><td></td></tr>
      <tr><td>3</td><td></td></tr>
      <tr><td>4</td><td></td></tr>
      <tr><td>5</td><td></td></tr>
      <tr><td>6</td><td></td></tr>
      <tr><td>7</td><td></td></tr>
      <tr><td>8</td><td></td></tr>
      <tr><td>9</td><td></td></tr>
      <tr><td>10</td><td></td></tr>
      <tr><td>11</td><td></td></tr>
      <tr><td>12</td><td></td></tr>
      <tr><td>13</td><td></td></tr>
      <tr><td>14</td><td></td></tr>
      <tr><td>15</td><td></td></tr>
      <tr><td>16</td><td></td></tr>
      <tr><td>17</td><td></td></tr>
      <tr><td>18</td><td></td></tr>
      <tr><td>19</td><td></td></tr>
      <tr><td>20</td><td></td></tr>
    </table>
  </body>
</html>

**gian21** · 26-05-2014, 23:11

grazie mille non conoscevo proprio questo selettore strepitoso

Discussione: sfondo tabella più colori

Strumenti discussione

Ricerca discussione

Visualizza

sfondo tabella più colori

Permessi di invio