En algunos casos se nos ha planteado el tema de utilizar hojas de estilo que puedan variar en función de variables, por ejemplo: body{ color:<?=$color ?>; } O en páginas webs diseñadas con CSS, muchas veces nos interesa cambiar las dimensiones de una capa en función de la sección en que nos encontremos: #columnaIzquierda{ width:<?=$nuevaLongitud ?>; } La solución lógica, sería crear una hoja de estilos con extensión .php que nos permitiera modificar campos de la hoja de estilo de forma dinámica.
Por lo tanto, lo que tenemos que hacer es: <link type="text/css" media="screen" rel="stylesheet" href="estilo.php" /> Y por otro lado, subir el archivo estilo.php al servidor.
En teoría esto es factible, pero en la práctica no lo es. Sin ir mas lejos, solo hay que entrar en nuestra nueva web, con hojas de estilo dinámicas con PHP usando el navegador Firefox (por ejemplo), y veremos como no carga la hoja de estilos. Por otro lado, podemos hacer la prueba con Internet Explorer y veremos que si funciona...(esto no dice mucho a favor de IE xD).
¿Y cual es la solución? Pues es bien sencilla, solo hay que indicar al navegador que esa web, aunque tenga extensión .php es una hoja de estilos.
Para ello, lo que tenemos que hacer es añadir el siguiente código en nuestro archivo estilo.php: <?php header("Content-type: text/css"); ?> Tenemos que añadir esto al principio del todo, y luego operar con la hoja de estilos con normalidad, os pongo un ejemplo:
estilo.php: <?php header("Content-type: text/css"); ?> a {text-decoration:none;color:#333333; font-size: 10px;} a:hover {text-decoration:none;color:#666666; font-size: 10px;} if($menu == "panel"){ ?>#ColumnaCentro{ margin-top: 5px; float: left; width: 610px; padding: 10px; background-color:#FFFFFF; } }else{ ?>#ColumnaCentro{ margin-top: 5px; float: left; width: 490px; padding: 10px; background-color:#FFFFFF; } } ?>Creo que el funcionamiento del archivo estilo.php se entiende perfectamente con el ejemplo, en el que veis que en función de la sección en que se encuentra el usuario: en index.php?menu=panel, el ancho de la capa ColumnaCentro varia, este ejemplo esta hecho para una web, que en la derecha tiene un banner de 120x600, pero al entrar en la sección "panel", que es panel de administrador, ya no es necesario mostrar publicidad, y lo que hace el css es que dicha capa, ocupe también el espacio de 120px que ocupaba el banner, si os fijais, el campo width pasa de 490px a 610px cuando se entra al panel de administrador.
Esta es solo una de las muchas aplicaciones que se puede conseguir con esta técnica.
Un saludo y esperamos que os sirva de algo. ACTUALIZACIÓN Nos habeis enviado varios emails diciendo que el ejemplo que hemos usado no funciona, ya que el archivo estilo.php parece no identificar las variables que pasais por la url...
Por ejemplo si estais en index.php?menu=panel, parece como si la hoja de estilo no identificara la variable menu. La respuesta es sencilla: <link type="text/css" media="screen" rel="stylesheet" href="estilo.php?menu=<?=$menu ?>" /> Teneis que pasar las variables hacia la hoja de estilo.