Wie kann ich dieselbe CSS-Eigenschaft gleichzeitig auf mehrere Klassen anwenden?

Gleichzeitiges Anwenden von Stilen auf mehrere Klassen

In CSS ist es oft wünschenswert, dieselbe Eigenschaft auf mehrere Klassen anzuwenden. Dies kann erreicht werden, indem die Klassennamen durch Kommas getrennt werden, wodurch effektiv eine Liste der Klassen erstellt wird, für die die Eigenschaft gilt.

Betrachten Sie beispielsweise das folgende CSS-Snippet, das dieselbe margin-left-Eigenschaft auf zwei Klassen anwendet , „.abc“ und „.xyz“:

<code class="css">.abc, .xyz {
  margin-left: 20px;
}</code>

Dieser Code führt dazu, dass sowohl die Klassen .abc als auch .xyz den gleichen Wert für den linken Rand von 20 Pixeln haben.

Dies Der Ansatz kann besonders nützlich sein, wenn Sie dieselbe Eigenschaft auf mehrere Klassen anwenden möchten, die einem ähnlichen Zweck dienen. Durch die Konsolidierung der Stile in einer einzigen Regel können Sie Codewiederholungen vermeiden und Ihr CSS effizienter gestalten.

Im bereitgestellten Beispiel:

<a class="abc">Lorem</a>
<a class="xyz">Ipsum</a>

Beide Elemente haben aufgrund der kombinierten Regel .abc, .xyz { margin-left: 20px; }.

Das obige ist der detaillierte Inhalt vonWie kann ich dieselbe CSS-Eigenschaft gleichzeitig auf mehrere Klassen anwenden?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!