CSSBlog ES - /* El mejor recurso para enriquecer tu estilo */

Todo el mundo busca que sus códigos CSS sean compatibles con todos los navegadores. Rosemary es un sistema de modificación basado en un filtro open source modular para archivos CSS (OSMCFBMS4CSS). Hay que destacar que no es un framework CSS. Todo el que lo desee puede ir creando filtros para Rosemary, solo es necesario tener algunos conocimientos sobre PHP.

Un filtro es un paquete independiente de código que modifica el CSS o le atribuye nuevas habilidades. Por ejemplo, el filtro del navegador hará que puedas definir bloques o propiedades específicas de cada navegador.

Rosemary es Open Source (pensados para modificarse por una comunidad, cualquiera puede modificarlo), es simple y ligero y, gracias a los nuevos aportes de la comunidad, nunca está desactualizado. Existen muchas ideas que se nos pueden ocurrir para aportar nuevas características a Rosemary.

Algunos filtros que he encontrado son Mixins Filter (simula un nuevo tipo de herencia) e Include Filter (para incluir archivos CSS ya procesados en uno).

Ejemplo usando el filtro de variables:

define red: #ff0000;

define full wide: "600px";

#myDiv {

/* Color sera rojo */

color: @red;

/* La anchura sera de `"600px"` */

width: @full wide;

}

define red: #0000ff;

#myDiv2{

/* Color sera azul */

color: @red;

}

Ejemplo usando el filtro del navegador:

~!ie #myDiv{

/** Este bloque solo aparecera para los navegadores que no sean Internet Explorer **/

}

~gecko #myDiv{

/** Este bloque solo aparecera para los navegadores Gecko **/

}

~firefox3 #myDiv{

/** Este bloque solo aparecera para los navegadores Firefox 3.0**/

}

#myDiv{

/** Puede ser aplicado a las propiedades dentro de los bloques **/

~ie height: 100%;

~!ie height: 500px;

}

Finalmente, os muestro el enlace para descargar Rosemary:

¿Qué os parece?