¿Por qué CSS no admite de forma nativa variables y jerarquía?

11

Soy nuevo en el desarrollo de UI, pero me siento muy incómodo con el funcionamiento de CSS.

Mi caso de uso es que quería aplicar algunos estilos específicos dentro de un particular diven una página.

Intento de CSS:

div.class1 {
    font: normal 12px arial, helvetica, sans-serif;
    font-color: #f30;
}
div.class1 div.class2 {
    border: 1px solid #f30;
}

MENOS intento:

@red: #f30;
@font-family: arial, helvetica, sans-serif;
div.class1 {
    font: normal 12px @font-family;
    font-color: @red;
    div.class2 {
        border: 1px solid @red;
    }

La versión CSS puede provocar errores, ya que te obliga a repetir #f30y div.class2cada vez que intentas lograr la jerarquía y la reutilización de variables.

Mis preguntas:

  • ¿Por qué ese CSS dificulta las cosas?
  • MENOS no hace nada especial, ¿solo hace mejoras obvias y se traduce en CSS?
  • ¿Qué es lo que CSS quiere motivar a los usuarios debido a que promueve un estilo de codificación tan redundante?

Creo firmemente que CSS debería ser MENOS. Definitivamente estoy pasando por alto alguna ventaja obvia de por qué las cosas se hacen de esa manera en CSS. Pensé que era un problema heredado, pero me sorprendió cuando no vi ningún intento de resolver esto con CSS3.

Por favor, ayúdame a entender cómo debo acercarme a CSS.

Yugal Jindle
fuente

Respuestas:

15

CSS no está tratando de hacer las cosas más difíciles a propósito, fue diseñado con un objetivo mucho más simple en mente, las variables y las jerarquías son apenas sus únicas deficiencias. LESS y Sass existen específicamente para abordar estas deficiencias, y hasta que cualquiera de las capacidades sea compatible de forma nativa, debe atenerse a ellas.

Dicho esto, el Grupo de Trabajo CSS del W3C está trabajando en borradores tanto para las variables CSS como para las jerarquías CSS:

No hay absolutamente ninguna manera de saber cuándo un borrador estará listo para la implementación, o qué tan pronto los principales navegadores los adoptarán. Todo lo que puedo decir es que el borrador de Variables CSS está más cerca de ser adoptado, ya puede probar las variables CSS de Chrome, Safari y Firefox, pero tenga en cuenta que el soporte en los tres navegadores se considera experimental y está sujeto a cambios. Lea Uso de variables CSS en MDN para más detalles.

Yannis
fuente
1
Gran respuesta, pensé que me faltaba algo realmente obvio. :)
Yugal Jindle
1
@YugalJindle Eche un vistazo a dev.w3.org/csswg para ver todo lo que el Grupo de Trabajo de CSS está trabajando, algunas cosas bastante interesantes allí.
Yannis