Skip to content

Instantly share code, notes, and snippets.

@ataka
Created September 14, 2009 16:15
Show Gist options
  • Save ataka/186753 to your computer and use it in GitHub Desktop.
Save ataka/186753 to your computer and use it in GitHub Desktop.
CSS Counter
CSS counter sample script
h1 {
counter-reset: chapter;
}
h2 {
counter-increment: chapter;
counter-reset: section
}
h2:before {
content: "Chapter " counter(chapter) ". ";
}
h3 {
counter-increment: section;
}
h3:before {
content: "Section " counter(chapter) "." counter(section) ". ";
}
<html>
<head>
<title>CSS Counter Sample</title>
<link href="sample.css" rel="stylesheet" type="text/css"/>
</head>
<body>
<h1>CSS Counter Sample</h1>
<h2>OS</h2>
<h3>Linux</h3>
<h3>MacOS</h3>
<h3>Windows</h3>
<h2>Company</h2>
<h3>Google</h3>
<h3>Apple</h3>
<h3>Microsoft</h3>
<h3>Yahoo!</h3>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment