Kann eine CSS-Klasse eine oder mehrere andere Klassen erben?

Question

Ist es möglich, eine CSS-Klasse zu erstellen, die von einer anderen CSS-Klasse (oder mehreren) "erbt".

Nehmen wir zum Beispiel an, wir hätten:

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

Ich würde gerne etwas in dieser Art machen:

.composite 
{
   .something;
   .else
}

wo die Klasse ".composite" sowohl inline als auch mit rotem Hintergrund angezeigt würde

Answer 1

Schauen Sie sich CSS an verfassen. : https://bambielli.com/til/2017-08-11-css-modules-composes/

nach ihnen:

.serif-font {
    font-family: Georgia, serif;
}

.display {
    composes: serif-font;
    font-size: 30px;
    line-height: 35px;
}

Ich verwende es in meinem React-Projekt.

Answer 2

Das, wonach Sie fragen, gibt es tatsächlich - allerdings in Form von Zusatzmodulen. Sehen Sie sich diese Frage auf Besseres CSS in .NET für Beispiele.

チェックする Larsenals Antwort zur Verwendung von LESS um eine Vorstellung davon zu bekommen, was diese Add-ons tun.

Answer 3

Wenn Sie einen leistungsfähigeren Textpräprozessor als LESS suchen, sollten Sie sich PPWizard ansehen:

http://dennisbareis.com/ppwizard.htm

Achtung, die Website ist wirklich hässlich und es gibt eine kleine Lernkurve, aber sie ist perfekt, um sowohl CSS- als auch HTML-Code über Makros zu erstellen. Ich habe nie verstanden, warum nicht mehr Web-Programmierer es verwenden.

Answer 4

Sie können erreichen, was Sie wollen, wenn Sie Ihre .css-Dateien durch php vorverarbeiten. ...

$something='color:red;'
$else='display:inline;';
echo '.something {'. $something .'}';
echo '.else {'. $something .'}';
echo '.somethingelse {'. $something  .$else '}';

...