Unterschied zwischen Klasse und ID

Klasse vs id

Cascading Style Sheets (CSS) ist eine Sprache, die das Aussehen und die Formatierung eines Dokuments, das mit einer Markup -Sprache geschrieben wurde, beschreibt. CSS wird häufig verwendet, um Webseiten in HTML zu stylen. CSS ermöglicht die Angabe Ihrer eigenen Stilauswahlern zusätzlich zum Anwenden von Stilen für HTML -Elemente. Dies geschieht mit den ID- und Klassenauswahlern. Bei der Angabe eines Stils für ein einzelnes eindeutiges Element wird der ID -Selektor verwendet. Wenn Sie einen Stil für eine Gruppe von Elementen angeben, wird der Klassenauswahl verwendet.

Was ist eine Klasse?

In CSS kann der Klassenauswahl verwendet werden, um Ihren eigenen Stil auf eine Gruppe von Elementen anzuwenden. Der Klassenwählte wird verwendet, um einen bestimmten Stil auf eine Reihe von Elementen mit derselben Klasse anzuwenden. In CSS wird ein Klassenauswahl durch einen vollständigen Stopp identifiziert (.). Das Folgende ist ein Beispiel für einen in CSS definierten Klassenauswahl.

.meine Klasse

Farbe blau;

Schriftdicke: fett;

HTML kann sich auf die in CSS definierte Klasse beziehen, indem die Attributklasse wie gezeigt 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 im selben Element mehrere Klassen verwendet werden, werden die Klassen in das Klassenattribut eingefügt, das durch einen Raum wie gezeigt abgrenzt wird.

Dies ist meine Formatierung mit zwei Klassen

Was ist ein ID?

In CSS kann der ID -Selektor verwendet werden, um Ihren eigenen Stil auf ein einzelnes einzigartiges 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;

Text-Align: Recht;

HTML kann sich auf den in CSS definierten ID -Selektor beziehen, indem die Attribut -ID wie gezeigt verwendet wird.

Dies ist mein Formatierungsformat aus einem ID -Selektor

IDs sind eindeutig. Daher kann jedes Element nur eine einzelne 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 Hash -Wert enthält (e.G. http: // myweb.com#my_id) Der Browser versucht, das Element automatisch mit der ID "my_id" zu suchen und die Webseite zu scrollen, um dieses Element anzuzeigen. Dies ist ein einer Grund, warum die Seite mit dieser spezifischen ID ein einzelnes Element haben sollte, damit der Browser dieses Element lokalisieren kann.

Was ist der Unterschied zwischen Klasse und ID?

Obwohl sowohl der Klassenauswahl- als auch der ID -Selektor verwendet werden können, um Ihren eigenen Stil auf Elemente auf einer Webseite anzuwenden, haben sie einige wichtige Unterschiede. Der Klassenwähler kann verwendet werden, um Ihren eigenen Stil auf eine Gruppe von Elementen anzuwenden, während der ID -Selektor verwendet wird, um einen Stil auf ein einzelnes, eindeutiges Element anzuwenden. Bei der Verwendung von IDs kann jedes Element nur eine einzelne ID haben und jede Seite kann nur ein einzelnes Element mit dieser spezifischen ID haben, aber die Klasse kann 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, um das Element mit dieser ID anzuzeigen. Dies ist jedoch mit dem Klassenauswahl nicht möglich.