Forskjell mellom id og klasse i CSS
Share
De hovedforskjell mellom id og klasse i CSS er det at ID brukes til å bruke styling til ett unikt element mens klassen brukes til å bruke styling til flere elementer.
Det finnes ulike teknologier innen webutvikling. De største språkene for å utvikle nettsteder er HTML, CSS og JavaScript. HTML står for Hyper Text Markup Language. Det bidrar til å utvikle strukturen på nettsiden. JavaScript bidrar til å gjøre nettsiden mer dynamisk. CSS står for Cascading Style Sheets. Det bidrar til å legge til stiler og for å gjøre nettsidene mer presentable. CSS-reglene gjelder for HTML-elementene. CSS-valgene hjelper også å finne elementene og bruke den nødvendige stilen til HTML-kodene. id og klasse er to typer selektorer.
Nøkkelområder dekket
1. Hva er CSS-regler
- Definisjon, eksempel
2. Hva er id
- Definisjon, eksempel
3. Hva er klassen
- Definisjon, eksempel
4. Forskjell mellom id og klasse
- Sammenligning av nøkkelforskjeller
Nøkkelord
Klasse, CSS Regler, ID
Hva er CSS-regler
CSS består av et sett med regler. Nettleseren kan tolke disse reglene og bruke dem til de angitte elementene i dokumentet. En CSS-stilregel består av tre seksjoner. De er selector, eiendom og verdi. Erklæring refererer til kombinasjonen av eiendom og verdi. De vises i et par krøllete braces som følger.
selector property: value;
Selector - Hjelper med å identifisere elementet for å bruke stilen
Eiendom - Et attributt. Alle HTML-attributter konverteres til CSS-egenskaper. Noen eksempler er farge, tekstjustering, kantlinje osv.
Verdi - Verdi er det som er tildelt eiendommen. For eksempel kan blå tilordnes til egenskapsfarge.
Hva er id
Programmereren kan definere en stilregel basert på elementets ID. Alle elementene med samme id vil bli brukt med den definerte stilen. For å velge et element med et bestemt ID, bør det være et # (hash) symbol etterfulgt av elementets ID.
Anta at HTML-filen inneholder en setning som følger.
CSS-filen inneholder følgende kodestykke.
# Header1
farge: blå;
Når nettleseren tolker HTML-setningen, kontrollerer den id av h1-elementet, som er header1 i CSS-filen. Deretter gjelder den definerte CSS-regelen til h1-elementet. Derfor vil teksten Hello World vises i farger blå.
IDet er unikt på siden. Derfor brukes idvelgeren til ett unikt element.
Hva er klassen
I likhet med id, kan programmereren definere stilreglene basert på elementets klasse. Alle elementene med samme klasse vil bli brukt med en definert stil. For å velge et element med en bestemt klasse, bør det være en. (periode) symbol etterfulgt av navn på klassen.
Anta at HTML-filen inneholder følgende setninger.
CSS-filen inneholder følgende kodestykke.
.header1
farge: blå;
Når nettleseren tolker HTML-setningen, kontrollerer den klassen av h1-elementet, som er header1 i CSS-filen. Deretter gjelder den definerte CSS-regelen for alle h1-elementene. Derfor vil teksten Hello World 1 og Hello World 2 vises i farger blå.
Det er mulig å bruke samme klasse på flere elementer. Derfor er klassevalgeren brukt til flere elementer.
Forskjell mellom id og klasse i CSS
Definisjon
id er en väljare i CSS som stiler elementet med et spesifisert ID mens klassen er en väljare i CSS som formaterer de valgte elementene med en bestemt klasse.
syntax
ID-syntaksen er #id css erklæringer; . Klassesyntaxen er .class css declarations;
bruk
Videre er bruken av id å bruke styling til ett bestemt element. Bruken av klassen er å bruke styling til flere elementer.
Konklusjon
ID og klasse er to valgorer i CSS som tillater bruk av styling til HTML-elementene. Hovedforskjellen mellom id og klasse i CSS er at id brukes til å bruke styling til et unikt element mens klassen brukes til å bruke styling til flere elementer.
Henvisning:
1. "CSS Syntax og Selectors." W3Schools Online Web Tutorials, Tilgjengelig her.
Bilde Courtesy:
1. "CSS.3" Av Nikotaf - Eget arbeid (CC BY-SA 4.0) via Commons Wikimedia
