Unterschied zwischen Klasse und ID

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 Gestalten von in HTML geschriebenen Webseiten verwendet. Mit CSS können Sie zusätzlich zu den Stilen für HTML-Elemente auch eigene Stil-Selektoren festlegen. Dies geschieht mit den ID- und Klassenselektoren. Wenn Sie einen Stil für ein einzelnes eindeutiges Element angeben, wird der ID-Selektor verwendet. Wenn Sie einen Stil für eine Gruppe von Elementen angeben, wird der Klassenselektor verwendet.

Was ist eine Klasse??

In CSS kann der Class Selector verwendet werden, um einen eigenen Stil auf eine Gruppe von Elementen anzuwenden. Die Klassenauswahl wird verwendet, um einen bestimmten Stil auf eine Gruppe von Elementen derselben Klasse anzuwenden. In CSS wird ein Klassenselektor durch einen Punkt (.) Gekennzeichnet. Im Folgenden finden Sie ein Beispiel für einen in CSS definierten Klassenselektor.

.meine Klasse

Farbe blau;

Schriftdicke: fett;

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

Das ist meine Formatierung

Das 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 getrennt wird (siehe unten).

Dies ist meine Formatierung mit zwei Klassen

Was ist eine ID??

In CSS kann der ID-Selektor verwendet werden, um Ihren eigenen Stil auf ein einzelnes eindeutiges Element anzuwenden. In CSS wird ein ID-Selektor durch einen Hash (#) identifiziert. Im Folgenden finden Sie 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 angegebene Attribut-ID verwendet wird.

Dies ist mein Formatierungsformular, ein ID-Selektor

IDs sind eindeutig. Daher kann jedes Element nur eine einzige ID haben und jede Seite kann nur ein einzelnes Element mit dieser spezifischen ID haben. IDs haben ein wichtiges Merkmal, das mit einem Browser verwendet werden kann. Wenn die Seiten-URL einen Hashwert enthält (z. B. http: //myweb.com#my_id), versucht der Browser, das Element mit der ID "my_id" automatisch zu finden und 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 Class-Selector als auch der ID-Selector verwendet werden können, um einen eigenen Stil auf Elemente einer Webseite anzuwenden, weisen sie einige wichtige Unterschiede auf. Mit dem Class-Selector können Sie Ihren eigenen Stil auf eine Gruppe von Elementen anwenden, während der ID-Selector verwendet wird, um einen Stil auf ein einzelnes, eindeutiges Element anzuwenden. Bei der Verwendung von IDs kann jedes Element nur eine einzige ID haben, und jede Seite kann nur ein einziges Element mit dieser spezifischen ID haben. Class kann jedoch für mehrere Elemente verwendet werden, und ein einzelnes Element kann mehrere Klassen verwenden. Darüber hinaus kann ID zum automatischen Scrollen einer Seite verwendet werden, um das Element mit dieser ID anzuzeigen. Dies ist jedoch mit der Klassenauswahl nicht möglich.