Por defecto, tablas utilizan un color de fondo uniforme para cada fila. Las tablas con grandes cantidades de datos y muchas filas pueden parecer difíciles de leer debido a esto. Usando una combinación de clases en un archivo CSS y PHP scripting , puede alternar colores de las filas de una tabla. Va a utilizar un bucle para recorrer cada fila, independientemente de la cantidad que usted tiene en la mesa. Usted puede usar los datos de filas de la tabla de cualquier fuente , incluyendo una variable de matriz o de los registros tomados de una base de datos . Instrucciones
1
Abra el archivo CSS. Escriba lo siguiente para definir dos clases:
fila1 {background - color: # FFFFFF ;} .
Fila2 . {Background - color: # b0b0b0 ;}
Las filas que el uso de la clase " fila1 " tienen un fondo blanco, y las filas que utilizan " fila2 " tienen un fondo gris claro.
2
Abra el archivo HTML. Escriba lo siguiente para crear una nueva tabla en HTML:
datos < /th >
< p> < /tr >
3 Escriba lo siguiente para abrir una etiqueta PHP y obtener la información que va a utilizar para rellenar la tabla :
< php
$ myArray = array (" artículo 1 ", " artículo 2 ", " artículo 3 ", " artículo 4 ");
$ i = 0 ;
"$ i" variable actúa como un contador de filas alternas . . Sustituir "$ myArray " con los datos reales que usted necesita, tales como registros de una base de datos
4 Escriba el siguiente a colores de fila alternos en la tabla , a continuación, cierre las etiquetas PHP y la tabla : < br > foreach ($ myArray as $ data ) {
if ( $ i % 2 == 1 ) {
echo " |
\\ n " . $ datos . "< /td > \\ n < /tr > \\ n";
} else {
echo " |
\\ n " . $ datos . "< /td > \\ n < /tr > \\ n"; }
$ i + + ; ?
}
> < br > < /table >
el " si " función realiza un cálculo " mod " en el "$ i" variable de contador . Cuando el resultado es una, la clase " fila1 " con el color blanco fila se aplica a la fila. Cuando el resultado es cero , la clase " fila2 " con el color gris claro se aplica a la fila. La variable contador se incrementa en uno, y la función se repite hasta que todos los registros de la variable $ myArray se carga en la tabla .
5 guardar los archivos HTML y CSS y subirlas a su servidor Web.
|
