Per impostazione predefinita, le tabelle utilizzano un colore di sfondo uniforme per ogni riga. Tavoli con grandi quantità di dati e molte file potrebbero apparire di difficile lettura a causa di questo. Usando una combinazione di classi in un file CSS e script PHP, è possibile alternare i colori delle righe in una tabella. Si utilizzerà un ciclo per scorrere ogni riga, indipendentemente dal numero che avete in tabella. È possibile utilizzare i dati per le righe della tabella da qualsiasi fonte, compresi una variabile di array o record presi da un database.

istruzione

1 Aprire il file CSS. Digitare la seguente per definire due classi:

.row1 {background-color: #FFFFFF; }

.row2 {background-color: # B0B0B0; }

Le righe che utilizzano la classe "row1" hanno uno sfondo bianco, e le righe che utilizzano "row2" hanno uno sfondo grigio chiaro.

2 Aprire il file HTML. Digitare la seguente per creare una nuova tabella in HTML:

<Table>

<Tr>

<Th> Dati </ th>

</ Tr>

3 Digitare la seguente per aprire un tag PHP e ottenere le informazioni che verrà utilizzato per popolare la tabella:

<? Php

$ MyArray = array ( "punto 1", "voce 2", "punto 3", "punto 4");

$ I = 0;

Il "$ i" atti variabile come contatore a righe alternate. Sostituire "$ myArray" con i dati effettivi si ha bisogno, come ad esempio le righe da un database.

4 Digitare quanto segue per i colori di righe alternati nella tabella, quindi chiudere i tag PHP e tabella:

foreach ($ myArray da $ dati) {

if ($ i% 2 == 1) {

echo "<tr class = \" row1 \ "> \ n <td>". $ Data. "</ Td> \ n </ tr> \ n";

} altro {

echo "<tr class = \" row2 \ "> \ n <td>". $ Data. "</ Td> \ n </ tr> \ n";

}

$ I ++;

}

?>

</ Table>

La funzione di "se" esegue un calcolo "mod" sul "$ i" variabile contatore. Quando il risultato è uno, la classe "row1" con il colore di riga bianca viene applicato alla riga. Se il risultato è zero, la classe "row2" con il colore grigio chiaro viene applicato alla riga. La variabile contatore aumenta poi da uno, e la funzione ripete finché tutti i record dalla variabile $ myArray viene caricata nella tabella.

5 Salvare i file HTML e CSS e caricare sul server Web.