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.
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.
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:
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.
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.