Uno de los trucos mas interesantes asociados con CSS es la habilidad de generar hojas de estilo utilizando funcionalidad en el lado del servidor. Yo lo he usado para cambiar imágenes de fondo en la cabecera de websites, para generar paletas de colores dependiendo de las preferencias del usuario, y para un montón de cosas mas.
Hay dos componentes para generar CSS con un lenguaje como PHP. El primero es poder incorporar la hoja de estilos en la pagina. Para eso usamos el @import de CSS:
@import "backgrounds.php"
No importa si el archivo importado es un CSS estático mientras el MIME type sea text/css. En PHP esto se logra con la funcion header
header("Content-type: text/css");
El resto del archivo puede ser una combinación de bloques de PHP generando CSS o CSS estático, no importa.
Como había mencionado, uno de los usos de esta funcionalidad es cambiar la imagen de fondo en las cabeceras de las paginas, en esta ocasión lo vamos a ver cambiando la imagen de fondo de la pagina completa, para demostrar el uso de un CSS dinámico. Las imágenes van a estar en una carpeta y PHP va a seleccionar una de ellas aleatoriamente y creara las reglas de CSS necesarias para aplicarla al background de la pagina.
La aplicación genera un numero aleatorio entre 0 y el numero total de imágenes. Las imágenes están almacenadas en un Array y la imagen seleccionada es llamada con el numero aleatorio. Un ejemplo
La ventaja de esta técnica es que se pueden guardar las imágenes en una carpeta y dejar que la aplicación se encargue de seleccionar la imagen por ella misma.
Se puede usar esta técnica para seleccionar imágenes, colores, cambiar el tamaño de las fuentes, etc… La única limitante es mantener el CSS pequeño y rápido, no queremos que el CSS este lento y dure mucho cargando.
Entradas Relacionadas:
Entonces PHP reconoce cada archivo contenido en la carpeta y automaticamente las aplica en arrays que luego se puede aprovechar ???. Que interesante que tenga esa capacidad.