demo · v138

Nested outline with counters()

The visual outline reads “1.2.3”, but a screen reader announces “Subsection 1.2.3” — because counters() works in the alt-text side of the slash. Toggle the document depth to feel the difference.

checking support…
  1. Foundations
    1. Why structure matters
    2. Counters and content
      1. The slash syntax
      2. Nested counters with counters()
  2. Practice
    1. Authoring

the new line

li::before {
  /* Visual: "1.2.3" — Alt: "Subsection 1.2.3" */
  content: counters(chap, ".", decimal) " "
         / "Subsection " counters(chap, ".", decimal);
}

Pre-138, alt-text inside content rejected the counter functions: you could only ship a literal string. Anything dynamic had to be duplicated as an aria-label at author time, which authors rarely did, so screen-reader users heard the raw numbers without context.

see also