Skip to main content

Tabs slides

Group alternative code, configuration, or explanations under selectable tabs.

Source​

---
@type: tabs

## Validation modes

### Source
Inspect syntax and configuration before building.

### Browser
Check rendered content, controls, and navigation.

Rendering and interaction​

Each third-level heading becomes a tab label and its following content becomes the panel. Use explicit @type: tabs, keep labels short, and test both tab buttons and Up/Down cycling. For code examples, use a longer outer Markdown fence when demonstrating nested code fences.

Add speaker notes and run source validation before building. Test the slide in the generated deck; the HTML structure and CSS classes are implementation details, not a substitute for checking behavior.

See directives, speaker notes, and keyboard controls.