<input type='radio' id='sect1toggle' name='toggles' checked>
<section>
  <h1>1</h1>
  <label for='sect2toggle'>Next</label>
</section>

<input type='radio' id='sect2toggle' name='toggles'>
<section>
  <h1>2</h1>
  <label for='sect1toggle'>Back</label>
  <label for='sect3toggle'>Next</label>
</section>

<input type='radio' id='sect3toggle' name='toggles'>
<section>
  <h1>3</h1>
  <label for='sect2toggle'>Back</label>
  <label for='sect4toggle'>Next</label>
</section>

<input type='radio' id='sect4toggle' name='toggles'>
<section>
  <h1>4</h1>
  <label for='sect3toggle'>Back</label>
</section>
input {
  display: none;
}

label {
  display: inline-block;
  background-color: hsl(0,0%,75%);
  padding: 3px 6px;
  border: solid 1px black;
}

section {
  display: none;
}

input:checked + section {
  display: block;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.