February 7, 2019

PHP vs CSS

Como ya se cito anteriormente, CSS es un lenguaje que define el color, tamaño y estructura de la web en lo que apariencia se refiere, y el cual tiene que interpretar el navegador para mostrar la web del modo esperado por el desarrollador web.

CSS (siglas en inglés de Cascading Style Sheets), en español «Hojas de estilo en cascada», es un lenguaje de diseño gráfico para definir y crear la presentación de un documento estructurado escrito en un lenguaje de marcado.​ Es muy usado para establecer el diseño visual de los documentos web, e interfaces de usuario escritas en HTML.

Wikipedia

Por otra parte, podemos recordar que PHP se encarga de preparar en el servidor el documento HTML, el cual será mandado al navegador con toda la información y enlaces para que este pueda renderizar la página web según lo previsto.

PHP vs CSS
PHP vs CSS
Dentro de toda la información que manda el servidor se encuentra el código CSS, el cual puede incluirse de 3 formas:

  1. Lo que se considera «CSS inline» cuando el código CSS queda dentro de cada etiqueta HTML.
  2. Dentro del documento HTML en etiquetas propias <style>.
  3. En uno o varios documentos aparte con sólo codigo CSS.

En todos los casos PHP puede insertar todo este código CSS dentro del HTML como mejor convenga, aunque lo habitual es que todo el código vaya en uno o varios ficheros aparte según el punto 3. Se trata de ficheros del tipo style.css al cual sea hace referencia desde el HTML para que el navegador pueda descargarlo y aplicarlo.

Si bien con PHP podemos crear de modo dinámico una hoja de estilos CSS de modo similar a como lo hace para crear los documentos HTML justo antes de enviarlos al navegador… no suele ser lo habitual y el CSS suele ser un documento estático con todos los posibles estilos que se quieren aplicar en la web.

Lo que suele ser más habitual para trabajar de un modo dinámico desde PHP con CSS, es cambiando de modo dinámico «las clases CSS» que aparecen dentro del marcado HTML para cada elemento.

Por ejemplo, con PHP determinamos un listado de elementos HTML, pero al primero le otorgamos una clase adicional que no se incluye en el html del resto. Con esto el navegador al ver la hoja de estilos CSS aplicará en función de esta, diferente estilo al primer elemento por tener un clase CSS diferente adicional.

Otro modo menos recomendable pero también muy usado es integrando directamente el código CSS según punto 1 y 2 citados. Este codigo CSS se genera y/o altera dinámicamente por PHP según la lógica de programación determinada antes de enviarse como código CSS al navegador. Esto es posible porque planteamos de este modo el CSS dentro del HTML, y PHP puede generar y alterar el HTML.

Un ejemplo de usar PHP para determinar código CSS dentro del documento HTML es el definir para un elemento, una imagen de background cuya url está almacenada en la base de datos y no es viable dejarla escrita directamente en el código CSS ya que perdería el dinamismo de poder ser modificada por un gestor de contenidos como WordPress.

Si te ha gustado... ¡Compártelo!