Une classe CSS peut hériter d’un ou plusieurs autres classes ?

Question

Je me sens stupide d'avoir été un programmeur web depuis si longtemps et de ne pas savoir la réponse à cette question, en fait j'espère que c'est possible et je ne le savais pas à propos plutôt que de ce que je pense est la réponse (qui est qu'il n'est pas possible).

Ma question est de savoir si il est possible de faire une classe CSS qui "hérite" d'une autre classe CSS (ou plus d'un).

Par exemple, disons que nous avons eu:

.something { display:inline }
.else      { background:red }

Ce que j'aime faire, c'est quelque chose comme ceci:

.composite 
{
   .something;
   .else
}

où l' ".composite" de la classe à la fois d'affichage en ligne et ont un arrière-plan rouge

Answer 1

Il y a des outils comme moins, qui vous permettent de composer des CSS à un niveau supérieur d’abstraction semblable à ce que vous décrivez.

Moins ces appelle « Mixins »

Au lieu de

On pourrait dire

Answer 2

Vous pouvez ajouter plusieurs classes à un seul élément du DOM, par exemple

Héritage ne fait pas partie de la norme CSS.

Answer 3

Oui, mais pas exactement avec cette syntaxe.

Answer 4

Un élément peut prendre plusieurs classes :

Et c’est environ aussi proche que vous allez obtenir malheureusement. Je serais ravi de voir cette fonctionnalité, alias de classe un jour.

Answer 5

Non, vous ne pouvez pas faire quelque chose comme

.composite 
{
   .something;
   .else
}

Ce sont pas de "classe" noms dans le OO sens. .something et .else sont juste des sélecteurs rien de plus.

Mais vous pouvez spécifier deux classes sur un élément

<div class="something else">...</div>

ou vous pouvez regarder dans une autre forme d'héritage

.foo {
  background-color: white;
  color: black;
}

.bar {
  background-color: inherit;
  color: inherit;
  font-weight: normal;
}

<div class="foo">
  <p class="bar">Hello, world</p>
</div>

Où les paragraphes backgroundcolor et la couleur sont héritées de l'paramètres dans la enfermant div qui est - .foo de style. Vous pourriez avoir à vérifier l'exacte spécification du W3C. inherit est une valeur par défaut pour la plupart des propriétés de toute façon, mais pas pour tous.