Unterschied Zwischen Klasse Und ID

2024 Autor: Mildred Bawerman | [email protected]. Zuletzt bearbeitet: 2023-12-16 08:37

Klasse gegen ID

Cascading Style Sheets (CSS) ist eine Sprache, die das Aussehen und die Formatierung eines Dokuments beschreibt, das mit einer Auszeichnungssprache geschrieben wurde. CSS wird häufig zum Stylen von in HTML geschriebenen Webseiten verwendet. Mit CSS können Sie neben der Anwendung von Stilen für HTML-Elemente auch Ihre eigenen Stilselektoren angeben. Dies erfolgt mithilfe der ID- und Klassenselektoren. Bei der Angabe eines Stils für ein einzelnes eindeutiges Element wird der ID-Selektor verwendet. Bei der Angabe eines Stils für eine Gruppe von Elementen wird die Klassenauswahl verwendet.

Was ist eine Klasse?

In CSS kann die Klassenauswahl verwendet werden, um Ihren eigenen Stil auf eine Gruppe von Elementen anzuwenden. Der Klassen-Selektor wird verwendet, um einen bestimmten Stil auf eine Reihe von Elementen mit derselben Klasse anzuwenden. In CSS wird ein Klassenselektor durch einen Punkt (.) Identifiziert. Es folgt ein Beispiel für eine in CSS definierte Klassenauswahl.

.meine Klasse {

Farbe blau;

Schriftdicke: fett;

}}

HTML kann auf die in CSS definierte Klasse verweisen, indem die unten gezeigte Attributklasse verwendet wird.

Das ist meine Formatierung

Dies ist wieder meine Formatierung

Wie oben gezeigt, kann dieselbe Klasse für mehrere Elemente verwendet werden, und ein einzelnes Element kann mehrere Klassen verwenden. Wenn mehrere Klassen in demselben Element verwendet werden, werden die Klassen in das Klassenattribut eingefügt, das durch ein Leerzeichen wie unten gezeigt begrenzt ist.

Dies ist meine Formatierung mit zwei Klassen

Was ist ein Ausweis?

In CSS kann die ID-Auswahl verwendet werden, um Ihren eigenen Stil auf ein einzelnes eindeutiges Element anzuwenden. In CSS wird ein ID-Selektor durch einen Hash (#) identifiziert. Es folgt ein Beispiel für einen in CSS definierten ID-Selektor.

#meine ID {

Farbe Rot;

Textausrichtung: rechts;

}}

HTML kann auf den in CSS definierten ID-Selektor verweisen, indem die unten gezeigte Attribut-ID verwendet wird.

Dies ist meine Formatierung von einem ID-Selektor

IDs sind eindeutig. Daher kann jedes Element nur eine einzige ID haben und jede Seite kann nur ein einziges Element mit dieser spezifischen ID haben. IDs haben eine wichtige Eigenschaft, die mit einem Browser verwendet werden kann. Wenn die Seiten-URL einen Hash-Wert enthält (z. B. https://myweb.com#my_id), versucht der Browser, das Element mit der ID "my_id" automatisch zu finden und durch die Webseite zu scrollen, um dieses Element anzuzeigen. Dies ist ein Grund, warum die Seite ein einzelnes Element mit dieser spezifischen ID haben sollte, damit der Browser dieses Element finden kann.

Was ist der Unterschied zwischen Klasse und ID?

Obwohl sowohl der Klassen- als auch der ID-Selektor verwendet werden können, um Ihren eigenen Stil auf Elemente auf einer Webseite anzuwenden, weisen sie einige wichtige Unterschiede auf. Mit der Klassenauswahl können Sie Ihren eigenen Stil auf eine Gruppe von Elementen anwenden, während mit der ID-Auswahl ein Stil auf ein einzelnes, eindeutiges Element angewendet wird. Bei Verwendung von IDs kann jedes Element nur eine einzige ID haben und jede Seite kann nur ein einzelnes Element mit dieser spezifischen ID haben. Die Klasse kann jedoch für mehrere Elemente verwendet werden, und ein einzelnes Element kann mehrere Klassen verwenden. Darüber hinaus kann ID verwendet werden, um eine Seite automatisch zu scrollen und das Element mit dieser ID anzuzeigen. Dies ist jedoch mit der Klassenauswahl nicht möglich.