NextCSS y CSS4

NextCSS se define como un traductor de CSS que le permite utilizar la última sintaxis CSS hoy. Lo que hace es transformar las nuevas especificaciones de CSS (aun en muy verde y en fase de desarrollo) en un CSS compatible y optimizado para que funcione en cualquier navegador.

NextCSS
NextCSS

¿Cual es la ventaja? Poder utilizar desde ya la nueva sintaxis de CSS desde hoy mismo y olvidarnos de todas las tendencias de preprocesadores y sus distintos lenguajes.

Todo el mundo está como loco comentado las nuevos selectores que tendremos en la nueva versión, que  os ayudará a seleccionar elementos de forma más eficaz e intuitiva:

https://www.w3.org/TR/selectors4/

Nuevos-selectores-css

Lo cierto es que la evolución de CSS va encaminada a parecerse a los preprocesadores más conocidos (SASS o LESS), una evolución más que lógica , por otra parte. Pero quizás el mayor inconveniente es que para no decantarse por ninguno de los dos ha elaborado una nueva sintaxis, que nos complica a todos un poco, ya que no se parece a ni a LESS ni a SASS… así nos encontramos que para declarar variables CSS, no se utilizará la @ como en LESS, ni $ como en SASS, sino que vendrá precedida de — y a la hora de llamarlas en nuestro estilo tendremos que hacerlo con la siguiente sintaxis: var(–*); veamos el ejemplo que nos pone la W3C:

:root {
 --main-color: #06c;
 --accent-color: #006;
}
/* The rest of the CSS file */
#foo h1 {
  color: var(--main-color);
}

También nos permitirá el uso de anidaciones y todo a lo que realmente estamos acostumbrados a realizar mediante los preprocesadores.

PostCSS
PostCSS

Pues bien, lo bueno es que podemos empezar a practicar ya, gracias nextCSS, que no es otra cosa que un postCSS, que nos permite traducir todas estas novedades para que nuestros navegadores lo entiendan.

Yo voy a empezar hoy mismo y próximamente os comentaré que tal me ha ido.

Comments are closed