Beispiel:CSS2 counter-increment.html

Aus SELFHTML-Wiki
Wechseln zu: Navigation, Suche 
<!DOCTYPE html>
<html> 
<head> 
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<link rel="stylesheet" media="screen" href="./Beispiel:SELFHTML-Beispiel-Grundlayout.css" />
	<title>Kapitelzählung mit counter-increment</title>
	<style>
body {
	counter-reset: section;
	margin: 20px auto;
}
h2 {
	counter-reset: subsection;
}
h2:before {
	counter-increment: section;
	content: "Band " counter(section) " - ";
	color:red;
}
h3:before {
	counter-increment: subsection;
	content: counter(section) "." counter(subsection) ": ";
	color:green;
}
	</style> 
</head>
<body>
<h1>Kapitelzählung mit counter-increment</h1>

	<h2>HTML</h2>
	<h3>Hyperlinks</h3>
	<h3>Elemente</h3>
	<h3>Tutorials</h3>
	<h2>CSS</h2>
	<h3>Eigenschaften</h3>
	<h3>Selektoren</h3>
	<h3>Tutorials</h3>
	<h2>JavaScript</h2>
	<h3>Funktionen</h3>
	<h3>Objekte</h3>
	<h3>APIs</h3>
	<h3>Tutorials</h3>

</body>
</html>
Abgerufen von „http://wiki.selfhtml.org/index.php?title=Beispiel:CSS2_counter-increment.html&oldid=72992“