Wie wir alle wissen, dass HTML und CSS Hand in Hand gehen, um ein reaktionsschnelles und attraktives Website -Design zu erstellen, müssen wir aber manchmal die gleichen CSS -Eigenschaften auf mehrere HTML -Tags anwenden. Nun stellt sich die Frage, was wir in einer solchen Situation tun? Hier kam CSS -Klassen herein, um uns vor dem Schreiben desselben CSS -Codes mehrmals zu bewahren.

Die CSS -Klasse ist der Schlüsselspieler beim Hinzufügen mehrerer Eigenschaften zu einem Element oder der gesamten Webseite. In Anbetracht der Bedeutung der CSS -Klasse soll dieser Artikel einen Einblick in die CSS -Klasse mit den folgenden Lernergebnissen geben:

• Was ist eine CSS -Klasse
• So verwenden Sie mehrere Klassen auf einem einzelnen HTML -Tag
• CSS -Klasse für ein bestimmtes HTML -Tag

Was ist eine CSS -Klasse

In CSS wird die Klasse verwendet, um eine Reihe von Eigenschaften zu definieren, um die CSS -Eigenschaften in Masse anzuwenden. Eine Klasse kann jeweils von mehreren HTML -Tags verwendet werden, was bedeutet. Eine Klasse ist mit der Gruppe der CSS -Eigenschaften definiert. Die allgemeine Syntax der CSS -Klasse ist unten bereitgestellt:

.Klassenname
CSS -Eigenschaften

In CSS, ein Punkt (.) wird verwendet, um einen Klassennamen festzulegen, und die CSS -Eigenschaften werden dann in lockige Klammern eingeschlossen.

So erstellen Sie eine CSS -Klasse

In erster Linie wird die CSS -Klasse verwendet, um eine Reihe von CSS -Eigenschaften einzuschließen und diese Eigenschaften dann durch Aufrufen der Klasse anzuwenden. Der folgende Code erklärt, wie CSS -Klassen erstellt werden.

CSS -Klasse

Dies ist der erste Absatz für das Klassen -Tutorial

Dies ist der zweite Absatz für das Klassen -Tutorial

Im obigen Beispiel erstellen wir drei CSS -Klassen, Container, Center Und Farbe. Diese Klassen werden auf dem angewendet ,

, Und

Tags.

Ausgang

In der oben genannten Ausgangsbehälterklasse gibt die Höhe und Breite des Behälter.

So verwenden Sie mehrere Klassen auf einzelnen HTMLTAG

In CSS können wir mehrere Klassen auf einem einzigen HTML -Tag verwenden, das beim Styling von HTML effizienter hilft. Das folgende Beispiel zeigt dieses Konzept besser.

CSS -Klasse

Dies ist der erste Absatz für das Klassen -Tutorial

Dies ist der zweite Absatz für das Klassen -Tutorial

Dies ist der dritte Absatz für das Klassen -Tutorial

Im obigen Code werden fünf CSS -Klassen erstellt. Der Container Die Klasse wird auf dem Tag angewendet, während der Rest der vier Klassen auf dem angewendet wird

Stichworte. Darüber hinaus werden vier verschiedene CSS -Klassen auf eine einzige angewendet

Tag (zuletzt

Ausgang

In der obigen Ausgabe wird der dritte Absatz mit der Anwendung mehrerer CSS -Klassen gleichzeitig angezeigt.

So verwenden Sie Klassen in HTML

Wir können auch eine CSS -Klasse für ein bestimmtes HTML -Tag angeben. Diese Art von Unterricht ist hilfreich, wenn wir jedes Mal, wenn es verwendet wird. Das folgende Beispiel hilft Ihnen, besser zu verstehen.

Beispiel

CSS -Klasse

Dies ist der erste Absatz, der innerhalb des Span -Tags geschrieben wurde

Dies ist der zweite Absatz für das Klassen -Tutorial

Dies ist der dritte Absatz für das Klassen -Tutorial

In diesem Beispiel haben wir eine Farbklasse speziell für erstellt

Tag und angewendet es auf markieren ebenso wie

.

Ausgang

Die obige Ausgabe zeigt deutlich, dass die Farbklasse nur daran funktioniert hat

Tag, weil es speziell für die Erstellung

Abschluss

In CSS ist die Klasse ein Attribut, mit dem mehrere CSS -Eigenschaften auf HTML -Tags angewendet werden können. Eine einzelne CSS -Klasse kann auf mehrere HTML -Tags angewendet werden und umgekehrt. Der Punkt (.) Symbol identifiziert eine CSS -Klasse. In diesem Artikel haben wir über CSS -Klassen erfahren, wie man mehrere CSS -Klassen für einzelne HTML -Tags und CSS -Klasse für bestimmte HTMLTAG verwendet. Auch dieselbe CSS -Klasse kann von mehreren Tags gleichzeitig verwendet werden.