Pourquoi CSS ne prend-il pas nativement en charge les variables et la hiérarchie?


11

Je suis nouveau dans le développement de l'interface utilisateur, mais je me sens très mal à l'aise avec le fonctionnement de CSS.

Mon cas d'utilisation est que je voulais appliquer certains styles spécifiques à l'intérieur d'un particulier divsur une page.

Tentative CSS:

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

MOINS tentative:

@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 version CSS peut induire des bugs, car elle vous oblige à répéter #f30et à div.class2chaque fois que vous essayez d'obtenir une hiérarchie et une réutilisation des variables.

Mes questions:

  • Pourquoi est-ce que CSS rend les choses difficiles?
  • MOINS ne fait rien de spécial - apporte simplement des améliorations évidentes et se traduit en CSS?
  • Qu'est-ce que CSS veut motiver chez les utilisateurs à cause de quoi il promeut un tel style de codage redondant?

Je crois fermement que CSS devrait être ce qui est MOINS. Certainement, je néglige un avantage évident de la raison pour laquelle les choses sont faites de cette façon en CSS. Je pensais que c'était un problème hérité, mais j'ai été surpris quand je n'ai vu aucune tentative pour résoudre ce problème avec CSS3.

Veuillez m'aider à comprendre comment dois-je aborder le CSS?

Réponses:


15

CSS n'essaie pas de rendre les choses plus difficiles exprès, il a été conçu avec un objectif beaucoup plus simple à l'esprit, les variables et les hiérarchies ne sont guère ses seuls défauts. LESS et Sass existent spécifiquement pour remédier à ces lacunes, et tant que l'une ou l'autre des capacités n'est pas prise en charge en mode natif, vous devez vous en tenir à elles.

Cela dit, le groupe de travail CSS du W3C travaille sur des ébauches pour les variables CSS et les hiérarchies CSS:

Il n'y a absolument aucun moyen de savoir quand l'un ou l'autre projet sera prêt pour la mise en œuvre, ni dans quel délai les principaux navigateurs les adopteront. Tout ce que je peux dire, c'est que le projet de variables CSS est plus proche d'être adopté, vous pouvez déjà tester les variables CSS de Drive dans Chrome, Safari et Firefox, mais gardez à l'esprit que la prise en charge dans les trois navigateurs est considérée comme expérimentale et susceptible de changer. Lisez Utilisation de variables CSS sur MDN pour plus de détails.


1
Excellente réponse, je pensais que je manquais quelque chose de vraiment évident. :)
Yugal Jindle

1
@YugalJindle Consultez dev.w3.org/csswg pour tout ce sur quoi le groupe de travail CSS travaille - des trucs assez excitants là-bas.
yannis
En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.