Child selectors en sibling combinators oefening

dabblet.css

/**
 * Child selectors en sibling combinators oefening
 Opdracht:
 Vervang alle … door de juiste selector of combinatie.
 De omschrijving staat er telkens boven
 */

body {
	background: #fff;
	font: 100%/1.5 georgia;
	max-width: 40em;
	margin: 0 auto;
	color: #333;
}
h1, p {
	margin: 1em 0;
}

/* Dit blok geldt voor alle h1's, ongeacht het niveau */
… {
	font-weight: normal;
	font-size: 150%;
	text-shadow: 0 0 .1em #333;
}
/* Dit blok geld alleen voor een h1 die een direct-child is van
een section, die weer een direct-child is van een article */
… {
	font-size: 135%;
	text-shadow: 0 0 .1em blue;
}

/* Dit blok geldt alleen voor een h1 die een direct-child is van 
een section, die weer een direct-child is van een section */
… {
	font-size: 120%;
	text-shadow: 0 0 .1em red;
}

/* Dit blok geld alleen voor elke paragraaf die direct
na een h1 staat */
… {
	margin: -1em 0 1em;
}
/* Dit blok geld alleen voor elke paragraaf die direct
na een andere paragraaf staat */
… {
	margin: -1em 0 1em;
	text-indent: 1.5em;
}

/* Dit blok geldt alleen voor alle paragrafen in 
de allerlaatste section van het artikel */
… {
	font-style: italic;
}

dabblet.html

<article>
	<h1>Selectors en combinators</h1>
	<p>Do you see any Teletubbies in here? Do you see a slender plastic tag clipped to my shirt with my name printed on it? Do you see a little Asian child with a blank expression on his face sitting outside on a mechanical helicopter that shakes when you put quarters in it? No?</p>
	<section>
		<h1>Alinea kopje</h1>
		<p>You think water moves fast? You should see ice. It moves like it has a mind. Like it knows it killed the world once and got a taste for murder. After the avalanche, it took us a week to climb out. Now, I don't know exactly when we turned on each other, but I know that seven of us survived the slide... and only five made it out.</p>
		<p>The path of the righteous man is beset on all sides by the iniquities of the selfish and the tyranny of evil men. Blessed is he who, in the name of charity and good will, shepherds the weak through the valley of darkness, for he is truly his brother's keeper and the finder of lost children.</p>
		<section>
			<h1>Alinea kopje</h1>
			<p>Do you see any Teletubbies in here? Do you see a slender plastic tag clipped to my shirt with my name printed on it? Do you see a little Asian child with a blank expression on his face sitting outside on a mechanical helicopter that shakes when you put quarters in it? No?</p>
			<p>You think water moves fast? You should see ice. It moves like it has a mind. Like it knows it killed the world once and got a taste for murder. After the avalanche, it took us a week to climb out. Now, I don't know exactly when we turned on each other, but I know that seven of us survived the slide...</p>
		</section>
	</section>
	<section>
		<h1>Conclusie</h1>
		<p>The path of the righteous man is beset on all sides by the iniquities of the selfish and the tyranny of evil men. Blessed is he who, in the name of charity and good will, shepherds the weak through the valley of darkness, for he is truly his brother's keeper and the finder of lost children.</p>
	</section>
</article>

settings.json

{"view":"split-vertical","prefixfree":"1","page":"css"}