Verschil tussen klasse en ID

Anonim

Klasse vs ID

Cascading Style Sheets (CSS) is een taal die de uitstraling en opmaak van een document met een opmaaktaal beschrijft beschrijft. CSS wordt veel gebruikt om webpagina's die in HTML zijn geschreven, te sturen. CSS stelt u in staat om uw eigen style selectors te specificeren, naast het toepassen van stijlen voor HTML-elementen. Dit gebeurt met behulp van de ID en de class selectors. Bij het specificeren van een stijl voor een enkel uniek element, wordt de ID selector gebruikt. Bij het specificeren van een stijl voor een groep elementen, wordt de class selector gebruikt.

Wat is een klas?

In CSS kan Class Selector worden gebruikt om uw eigen stijl aan te passen aan een groep elementen. De Class selector wordt gebruikt om een ​​specifieke stijl aan te passen aan een reeks elementen met dezelfde klasse. In CSS wordt een class selector geïdentificeerd met een full-stop (.). Hieronder volgt een voorbeeld van een class selector gedefinieerd in CSS.

. my_class {

kleur: blauw;

lettertype: vet;

}

HTML kan verwijzen naar de klasse die is gedefinieerd in CSS door gebruik te maken van de attribuut klasse zoals afgebeeld bellow.

Dit is mijn opmaak

Dit is mijn formattering opnieuw

Zoals hierboven getoond, kan dezelfde klasse gebruikt worden voor meerdere elementen en een enkel element kan meerdere klassen gebruiken. Wanneer meerdere klassen in hetzelfde element worden gebruikt, worden de klassen ingevoegd in het class attribuut dat wordt afgebakend door een ruimte zoals afgebeeld.

Dit is mijn opmaak met twee klassen

Wat is een ID?

In CSS kan ID-selector worden gebruikt om uw eigen stijl aan te passen aan een enkel uniek element. In CSS wordt een ID-selector geïdentificeerd door een hash (#). Hieronder volgt een voorbeeld van een ID-selector gedefinieerd in CSS.

#my_ID {

kleur: rood;

Text-align: rechts;

}

HTML kan verwijzen naar de ID-selector die is gedefinieerd in CSS door het attribuut-id te gebruiken, zoals afgebeeld bellow.

Dit is mijn formatteringsformulier een ID-selector

ID's zijn uniek. Elk element kan daarom alleen een enkel ID hebben en elke pagina kan slechts een enkel element hebben met die specifieke ID. ID's hebben een belangrijk kenmerk dat met een browser kan worden gebruikt. Als de pagina-URL een hash-waarde bevat (bijvoorbeeld // myweb. Com # my_id), probeert de browser het element automatisch te vinden met het ID "my_id" en bladert u de webpagina om dat element weer te geven. Dit is een reden waarom de pagina een enkel element met dat specifieke ID moet hebben, zodat de browser dat element kan vinden.

Wat is het verschil tussen klasse en ID?

Alhoewel zowel de Class selector als de ID-selector kunnen worden gebruikt om uw eigen stijl op elementen op een webpagina toe te passen, hebben ze belangrijke verschillen. Class selector kan worden gebruikt om uw eigen stijl aan te passen aan een groep elementen, terwijl de ID-selector gebruikt wordt om een ​​stijl aan een enkel, uniek element toe te passen. Bij het gebruik van ID's kan elk element alleen een enkel ID hebben en elke pagina kan slechts een enkel element hebben met die specifieke ID, maar klasse kan voor meerdere elementen worden gebruikt en een enkel element kan meerdere klassen gebruiken.Verder kan ID gebruikt worden om automatisch een pagina te scrollen om het element met die ID weer te geven, maar dit is niet mogelijk met de class selector.