HTML -Klassen

HTML -Klassen

Die Klasse ist ein Attribut des HTML -Elements, das zur Klassifizierung ähnlicher Elemente für das Styling verwendet wird. Die Klasse kann mehrere CSS- und JavaScript-bezogene Eigenschaften enthalten, die für verschiedene HTML-Elemente verwendet werden sollen. Die primäre Verwendung von Klassenattributen besteht darin, die Eigenschaften der Klasse des Stilblatts einem HTML -Element hinzuzufügen. JavaScript kann jedoch auch mit dem Klassenattribut aufgerufen werden. Dieser Artikel enthält die folgenden Lernergebnisse:

- Erstellen Sie eine Klasse

- So verwenden Sie eine Klasse in HTML

So erstellen Sie eine HTML -Klasse

Eine HTML -Klasse kann erstellt werden, indem das Klassenattribut in den HTML -Elementen verwendet wird. Die Klassen sind definiert, um mehrere Gruppen herzustellen, die mit denselben Styling -Eigenschaften verwendet werden können. Die folgende Syntax kann verwendet werden, um eine HTML -Klasse innerhalb des HTML -Elements zu erstellen:

Der Klassenname ist Fallempfindlichkeit und somit sorgfältig verwendet werden. Wenn Sie mehrere Klassen für ein einzelnes Element definieren möchten, müssen Sie den Speicherplatz zwischen den Namen der Klassen hinzufügen.

Beispiel 1: Einzelklasse in einem HTML -Element

Der folgende HTML -Code definiert ein Klassenattribut in der

Tag von HTML.






LinuxHint


Willkommen



Eine Klasse namens "primär" ist in der definiert

Schild. Das Bild des Codes ist unten bereitgestellt:

Beispiel 2: Mehrere Klassen in einem einzelnen HTML -Element

Der unten angegebene Code assoziiert ein einzelnes HTML -Element mit mehreren Klassen.

Notiz: Wenn Sie sich mit mehreren Klassen in einem HTML -Element befassen. Darüber hinaus sind die Klassennamen Benutzer definiert, sodass Sie eine davon auswählen oder Ihre eigenen erstellen können.






LinuxHint


Willkommen


Das Tal der Technik



Der obige Code zeigt, dass der

Tag ist mit der „primären“ Klasse verbunden, während die

Tag haben zwei Klassen "sekundär" und "tertiär"

Das Bild des Codes ist hier beigefügt:

So verknüpfen Sie eine HTML -Klasse mit CSS

Eine der Hauptzwecke von HTML -Klassen besteht darin, die Elemente kollektiv zu stylen. Zum Beispiel verbinden wir einige HTML -Elemente mit demselben Klassennamen und definieren Stylingeigenschaften gegen diesen Klassennamen. Diese Stile würden überall dort verteilt, wo dieser bestimmte Klassenname definiert ist. Die folgenden Schritte können befolgt werden, um die HTML -Klasse zum Herstellen von Stilen zu verwenden:

- Starten Sie ein Tag

- Verwenden Sie die folgende Syntax, um die Klasse mit Ihrem CSS zu verknüpfen

Der Klassenname bezieht sich auf die Klasse, die Sie im HTML -Code definiert haben und er wird mit Punkten gestartet, wie in der obigen Syntax gezeigt, und danach werden die Stylingeigenschaften in den Curly -Klammern definiert.

Beispiel 3: Verwenden einer einzelnen HTML -Klasse in CSS

Veranschaulichen wir die Verknüpfung einer einzelnen HTML -Klasse mit CSS. Der unten geschriebene Code verwendet eine einzelne Klasse mit HTML und CSS:






LinuxHint



Willkommen bei LinuxHint



- Die HTML -Klasse wird in der als „Notiz“ bezeichnet

Schild

- Wenn Sie es im Tag aufrufen, schreiben Sie “.Hinweis “und definierte dann die Stylingeigenschaften in den lockigen Klammern, wie im obigen Code zu sehen ist. Das folgende Bild liefert den im Editor geschriebenen Code:

Die Web-PAGE-Ausgabe des oben genannten HTML-Code ist unten bereitgestellt:

Beispiel 4: Verwenden Sie mehrere HTML -Klassen in CSS

Wie im früheren Teil des Leitfadens erläutert, können die mehreren Klassen auch in einem einzelnen HTML -Element verwendet werden. Der unten angegebene Code übt zwei Klassen in CSS aus und verwendet sie dann in einem einzelnen HTML -Element.






LinuxHint



Willkommen bei LinuxHint! ein führender Inhaltsanbieter



Der HTML -Code wird unten beschrieben:

- Die drei HTML -Klassen werden als "Bod", "Col" und "Fon" benannt

- Die "Bod" -Klasse ist in Tag definiert, während die "col" und "fon" in der definiert sind

Schild

Da werden zwei Klassen in der verwendet

Tag, so würden sie durch einen Raum so getrennt

erhält die Eigenschaften beider Klassen.

Das folgende Bild zeigt den Code:

Die Ausgabe des Codes auf der Webseite ist unten dargestellt:

Abschluss

Das HTML -Klassenattribut wird verwendet, um das HTML -Element zu kategorisieren. Mit Hilfe von HTML -Klassen können die HTML -Elemente kollektiv gestaltet werden. Dieser Artikel enthält eine beschreibende Anleitung zu HTML -Klassen und wie sie mit CSS verbunden sind. Wir haben mehrere Beispiele veranschaulicht, die die Erstellung von HTML -Klassen darstellen und sie mit CSS verknüpfen. Es wird der Schluss gezogen, dass die Integration von HTML -Klassen mit CSS der Hauptvorteil von HTML -Klassen ist.