Standardmäßig verwenden Tabellen eine einheitliche Hintergrundfarbe für jede Zeile . Tabellen mit großen Datenmengen und viele Zeilen erscheinen mag schwierig, da diese zu lesen. Mit einer Kombination von Klassen in einer CSS-Datei und PHP Scripting , können Sie Farben Zeile in einer Tabelle zu wechseln. Sie erhalten eine Schleife verwenden, um zyklisch durch jede Reihe , egal wie viele Sie haben in der Tabelle. Sie dürfen die Daten für Tabellenzeilen aus einer beliebigen Quelle , einschließlich einer Array-Variablen oder Datensätze aus einer Datenbank entnommen. Anleitung
1
Öffnen Sie die CSS -Datei. Geben Sie den folgenden zwei Klassen definieren :
row1 {background -color: # FFFFFF ;} .
Row2 . {Background -color: # B0B0B0 ;}
Alle Zeilen dass die Verwendung der " row1 " Klasse haben einen weißen Hintergrund, und alle Zeilen, die " row2 " benutzen, haben eine hellgraue Hintergrund.
2
Öffnen Sie die HTML-Datei. Geben Sie den folgenden um eine neue Tabelle in HTML zu erstellen :
Daten < /th> < p> < /tr> 3 Geben Sie den folgenden , um eine PHP-Tag zu öffnen und sich die Informationen, die Sie verwenden, um die Tabelle zu füllen wird : < php $ arr = array (" Punkt 1 " , "Item 2", " Punkt 3 ", " Punkt 4 "); $ i = 0; " $ i " Variable dient als Zähler zu abwechselnden Reihen . . Ersetzen Sie " $ myArray " mit den tatsächlichen Daten, die Sie benötigen, wie Zeilen aus einer Datenbank 4 Geben Sie die folgende Zeile , um alternative Farben in der Tabelle , und schließen Sie dann die PHP- und Tabellen-Tags : foreach ($ arr wie $ data) { if ($ i % 2 == 1) { echo " |
\\ n " . $ data . " | \\ n
\\ n";
} else { echo
"
\\ n " . $ data . " | \\ n
\\ n"; }
$ i + +; ?
}
>
< /table>
Die "if" -Funktion einen "mod" Berechnung auf der " $ i " Zählvariable führt . Wenn das Ergebnis positiv, ist das " row1 " -Klasse mit der weißen Farbe der Zeile Zeile angelegt . Wenn das Ergebnis Null ist, wird die " row2 " -Klasse mit der hellgraue Farbe der Zeile angelegt . Die Zählvariable dann um eins erhöht , und die Funktion wird wiederholt, bis jeder Datensatz aus der $ myArray Variable wird in die Tabelle geladen .
5
Speichern Sie die HTML -und CSS- Dateien und laden Sie sie auf Ihrem Webserver.