Klass kontra ID
Cascading Style Sheets (CSS) är ett språk som beskriver utseendet och formateringen av ett dokument skrivet med ett märkningsspråk. CSS används ofta för att utforma webbsidor skrivna i HTML. Med CSS kan du specificera dina egna stilväljare förutom att använda stilar för HTML-element. Detta görs med hjälp av ID och klassväljare. När du anger en stil för ett enskilt 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 av element. Klassväljaren används för att tillämpa en specifik stil på en uppsättning element med samma klass. I CSS identifieras en klassväljare med ett punkt (.). Följande är ett exempel på en klassväljare definierad i CSS.
.min_klass {
färg: blå;
font-weight: bold;
}
HTML kan referera till klassen definierad i CSS genom att använda attributklassen som visas nedan.
Detta ä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.
my_ID {
färg: röd;
text-align:right;
}
HTML kan referera till ID-väljaren som definieras i CSS genom att använda attribut-id som visas nedan.
Det här ä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 webbadressen till sidan innehåller ett hashvärde (t.ex. https://myweb.commy_id) försöker webbläsaren automatiskt hitta elementet med ID:t "my_id" och rulla webbsidan för att visa elementet. Detta är en anledning till varför sidan bör 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 av 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:n kan varje element bara ha ett enda ID och varje sida kan bara ha ett enda element med det specifika ID:n, men Klass kan användas för flera element och ett enda element kan använda flera Klasser. Dessutom kan ID användas för att rulla en sida automatiskt för att visa elementet med det ID:t, men detta är inte möjligt med klassväljaren.