De regels van de samengestelde klasse in CSS

De regels van de samengestelde klasse in CSS


Trapsgewijze opmaakmodellen kunt vereenvoudigen webdesign door het scheiden van ontwerp van structuur op HTML-pagina's. Kennen de verschillen tussen verschillende CSS selectors kan verder vereenvoudigen je stylesheets en vrijmaken van bandbreedte. Klasse en samengestelde selectors Gebruik CSS-regels voor het opmaken van de inhoud van uw pagina's, en u kunt hen samen verbeteren uw webpagina's.

CSS Selector typen

Een CSS een selector geldt stijleigenschappen, zoals kleur, plaatsing of het lettertype stijl, voor een HTML-element. Er zijn vele soorten selectors, het aanbieden van specifieke elementen zoals formuliervelden en opsommingstekens van besturen. U kunt gebruik maken van label selectors naar specifieke opmaak toepassen op alle tekst binnen bepaalde HTML-codes of id-selectors om toe te passen opmaak naar unieke HTML < div >-elementen. Sommige selectors, zoals klasse en tag selectors, kunnen samenwerken, terwijl anderen zoals ID-selectors andere selectors negeren. Selecteurs kunnen in CSS versie 2 en hoger, zelfs voorwaardelijke instructies opnemen.

Klassekiezers

Een klasseselector CSS maakt gebruik van een unieke naam die u in de HTML-code invoegt, en begint met de klassenaam voorafgegaan door een punt. Bijvoorbeeld, kan een klassenselector als volgt uitzien:

.myClass {tekengrootte: 90%; font-weight: bold;}

De klasse wordt toegepast door de naam van de klasse toe te voegen aan elk HTML-element dat u wilt vereffenen te. Bijvoorbeeld, kon u de bovenstaande klasse toepassen op een alinea:

< p klasse = "MijnKlasse" > Dit is tekst gestyled door deze efficiƫntieklasse < /p >

Als het < p >-tag is geformatteerd met behulp van een labelkiezer, geldt die opmaak ook voor de bovenstaande alinea.

Samengestelde Selectors

Een samengestelde selector is niet een unieke selector type; in plaats daarvan verwijst het naar een combinatie van twee of meer selectors. Samengestelde selectors combineren gemeenschappelijk opmaak zoals het lettertype toegepast op alle van de kopcodes van een pagina:

H1, h2, h3 {font-family: verdana, sans-serif}

Vervolgens kunt u elementen zoals de grootte van het lettertype opmaken als afzonderlijke label selectors.

Een samengestelde selector kunt u ook specifieke stijlelementen binnen andere elementen. Bijvoorbeeld, zou de volgende stijl toepassen op een < b >-tag in de klasse "MijnKlasse":

.myClass b {kleur: #333333;}

Terwijl de term "samengestelde selector" wordt gebruikt door ontwerpers en in HTML editors zoals Adobe Dreamweaver, verwijzen de specificatie W3C selectors niet naar samengestelde selectors, in plaats daarvan verwijst naar "groepering" en "afstammeling selectors."

Samengestelde Selector regels

Wanneer u een samengestelde selector op groep Labels met gemeenschappelijke elementen gebruikt, gebruik altijd een komma tussen elk label. Wanneer u een samengestelde selector opgeven opmaak in geneste elementen, het bredere element zoals een klasse of ID bevatten eerste, en vervolgens het element te worden genest in, zoals een label. U kunt gebruik maken van twee tags, klassen of twee id's, maar vergeet niet dat de tweede binnen uw HTML-code moet worden opgenomen binnen de eerste voor de samengestelde selector om haar werk te doen.