Klass mot ID
Cascading Style Sheets (CSS) är ett språk som beskriver utseendet och formateringen av ett dokument som är skrivet med ett markeringsspråk. CSS används ofta för att utforma webbsidor skrivna i HTML. CSS gör det möjligt att specificera dina egna stilväljare förutom att använda stilar för HTML-element. Detta görs med ID och klassväljare. När du anger en stil för ett enda unikt element används ID-väljaren. När du anger en stil för en grupp av element används klassväljaren.
Vad är en klass?
I CSS kan klassväljaren användas för att tillämpa din egen stil på en grupp element. Klassväljaren används för att tillämpa en viss stil på en uppsättning element med samma klass. I CSS identifieras en klassväljare med ett punkt (.). Nedan följer ett exempel på en klassväljare definierad i CSS.
.min klass {
färgen blå;
font-vikt: fet;
}
HTML kan referera till den klass som definierats i CSS med attributklassen som visas nedan.
Det här är min formatering
Det här är min formatering igen
Som visas ovan kan samma klass användas för flera element och ett enda element kan använda flera klasser. När flera klasser används i samma element infogas klasserna i klassattributet avgränsat av ett mellanslag som visas nedan.
Det här är min formatering med två klasser
Vad är ett ID?
I CSS kan ID-väljaren användas för att tillämpa din egen stil på ett enda unikt element. I CSS identifieras en ID-väljare med en hash (#). Följande är ett exempel på en ID-väljare definierad i CSS.
#mitt ID {
färgen röd;
textjustera: höger;
}
HTML kan referera till ID-väljaren definierad i CSS genom att använda attribut-ID som visas nedan.
Detta är min formatering från en ID-väljare
ID: n är unika. Därför kan varje element bara ha ett enda ID och varje sida kan bara ha ett enda element med det specifika ID: t. ID har en viktig egenskap som kan användas med en webbläsare. Om sidans URL innehåller ett hashvärde (t.ex. https://myweb.com#my_id) kommer webbläsaren att försöka hitta elementet automatiskt med ID: t "min_id" och bläddra på webbsidan för att visa det elementet. Detta är en anledning till att sidan ska ha ett enda element med det specifika ID: t, så att webbläsaren kan hitta det elementet.
Vad är skillnaden mellan klass och ID?
Även om både klassväljaren och ID-väljaren kan användas för att tillämpa din egen stil på element på en webbsida, har de några viktiga skillnader. Klassväljaren kan användas för att tillämpa din egen stil på en grupp element, medan ID-väljaren används för att tillämpa en stil på ett enda unikt element. När du använder ID kan varje element bara ha ett enda ID och varje sida kan bara ha ett enda element med det specifika ID: n, men Class kan användas för flera element och ett enda element kan använda flera klasser. Dessutom kan ID användas för att bläddra en sida automatiskt för att visa elementet med det ID, men detta är inte möjligt med klassväljaren.
