Skip to content

Instantly share code, notes, and snippets.

@joshbode

joshbode/numbered_headings.md

Last active December 16, 2024 18:59
Show Gist options
  • Save joshbode/491ad0e678d456ea8ddc to your computer and use it in GitHub Desktop.
Save joshbode/491ad0e678d456ea8ddc to your computer and use it in GitHub Desktop.
Download ZIP
Numbered Headings in Markdown via CSS
Raw
numbered_headings.md

World

Country

State

City

Suburb
Street
<style type="text/css"> body { margin: auto; max-width: 44em; font-family: Calibri, sans-serif; font-size: 18pt; } /* automatic heading numbering */ h1 { counter-reset: h2counter; } h2 { counter-reset: h3counter; } h3 { counter-reset: h4counter; } h4 { counter-reset: h5counter; } h5 { counter-reset: h6counter; } h6 { } h2:before { counter-increment: h2counter; content: counter(h2counter) ".\0000a0\0000a0"; } h3:before { counter-increment: h3counter; content: counter(h2counter) "." counter(h3counter) ".\0000a0\0000a0"; } h4:before { counter-increment: h4counter; content: counter(h2counter) "." counter(h3counter) "." counter(h4counter) ".\0000a0\0000a0"; } h5:before { counter-increment: h5counter; content: counter(h2counter) "." counter(h3counter) "." counter(h4counter) "." counter(h5counter) ".\0000a0\0000a0"; } h6:before { counter-increment: h6counter; content: counter(h2counter) "." counter(h3counter) "." counter(h4counter) "." counter(h5counter) "." counter(h6counter) ".\0000a0\0000a0"; } </style>
@fabiog1901
Copy link

For those that want to use GitHub Gist and for which CSS doesn't work, try creating the numbered headers yourself, see my Gist https://gist.github.com/fabiog1901/d6a41c4416eefe49c372f11cab2b2084.

Additionally, you can create a Table of Content.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment