Klasse vs ID
Cascading Style Sheets (CSS) er et språk som beskriver utseendet og formateringen til et dokument som er skrevet med et markup-språk. CSS er mye brukt til å style nettsider skrevet i HTML. CSS lar deg spesifisere dine egne stilvelgere i tillegg til å bruke stiler for HTML-elementer. Dette gjøres ved hjelp av ID- og klassevelgere. Når du spesifiserer en stil for et enkelt unikt element, brukes ID-velgeren. Når du spesifiserer en stil for en gruppe elementer, brukes klassevelgeren.
Hva er en klasse?
I CSS kan klassevelger brukes til å bruke din egen stil på en gruppe elementer. Klassevelgeren brukes til å bruke en bestemt stil på et sett med elementer med samme klasse. I CSS identifiseres en klassevelger med et punktum (.). Følgende er et eksempel på en klassevelger definert i CSS.
.my_class {
farge: blå;
font-weight: fet;
}
HTML kan referere til klassen definert i CSS ved å bruke attributtklassen som vist nedenfor.
Dette er min formatering
Dette er min formatering igjen
Som vist ovenfor, kan den samme klassen brukes for flere elementer, og et enkelt element kan bruke flere klasser. Når flere klasser brukes i samme element, settes klassene inn i klasseattributtet avgrenset med et mellomrom som vist nedenfor.
Dette er min formatering med to klasser
Hva er en ID?
I CSS kan ID-velger brukes til å bruke din egen stil på et enkelt unikt element. I CSS identifiseres en ID-velger med en hash (). Følgende er et eksempel på en ID-velger definert i CSS.
my_ID {
farge: rød;
text-align:right;
}
HTML kan referere til ID-velgeren definert i CSS ved å bruke attributt-ID-en som vist nedenfor.
Dette er formateringen min fra en ID-velger
ID-er er unike. Derfor kan hvert element bare ha en enkelt ID og hver side kan bare ha et enkelt element med den spesifikke IDen. ID-er har en viktig egenskap som kan brukes med en nettleser. Hvis nettadressen til siden inneholder en hash-verdi (f.eks. https://myweb.commy_id) vil nettleseren automatisk prøve å finne elementet med ID-en "my_id" og bla gjennom nettsiden for å vise det elementet. Dette er en av grunnene til at siden bør ha et enkelt element med den spesifikke ID-en, slik at nettleseren kan finne det elementet.
Hva er forskjellen mellom klasse og ID?
Selv om både klassevelgeren og ID-velgeren kan brukes til å bruke din egen stil på elementer på en nettside, har de noen viktige forskjeller. Klassevelgeren kan brukes til å bruke din egen stil på en gruppe elementer, mens ID-velgeren brukes til å bruke en stil på et enkelt, unikt element. Når du bruker IDer, kan hvert element bare ha en enkelt ID og hver side kan bare ha et enkelt element med den spesifikke IDen, men Klasse kan brukes for flere elementer og et enkelt element kan bruke flere Klasser. Videre kan ID brukes til å rulle en side automatisk for å vise elementet med den IDen, men dette er ikke mulig med klassevelgeren.
