Utilizzare alcune proprietà CSS in molti selettori senza editing HTML o utilizzando JS

Question

CSS:

.bananaTrans {
  -moz-transition : all 1s ease-in-out;
  -webkit-transition: all 1s ease-in-out;
  transition : all 1s ease-in-out;
}
.bananaClass {
  color: yellow;
}

HTML:

<div class="bananaClass">Banana Banana Banana</div>

L'obiettivo è quello di rendere ogni elemento che ha classe "bananaClass" ereditare le proprietà di "bananaTrans" senza modificare il codice HTML o utilizzando JavaScript.

( "bananaTrans") non hanno bisogno esattamente di essere una classe, è solo un mucchio di oggetti da usare tra gli altri selettori.

Answer 1

È possibile modificare il CSS? Basta aggiungere un selettore .bananaClass aggiuntivo

.bananaTrans, .bananaClass {
  -moz-transition : all 1s ease-in-out;
  -webkit-transition: all 1s ease-in-out;
  transition : all 1s ease-in-out;
}
.bananaClass {
  color: yellow;
}