<form>
  <strong>ESEMPIO PULSANTI DI OPZIONE</strong>
  <ul>
    <li>
      <input type="radio" name="rd" value="" id="r1">
      <label for="r1">Tizio</label>
    </li>
    <li>
      <input type="radio" name="rd" value="" id="r2" checked>
      <label for="r2">Caio</label>
    </li>
    <li>
      <input type="radio" name="rd" value="" id="r3">
      <label for="r3">Sempronio</label>
    </li>
  </ul>

  <hr>

  <strong>ESEMPIO CASELLE DI CONTROLLO</strong>
  <ul>
    <li>
      <input type="checkbox" name="Banana" value="Banana" id="r1">
      <label for="Banana">Tizio</label>
    </li>
    <li>
      <input type="checkbox" name="Apple" value="Apple" id="Apple" checked>
      <label for="Apple">Caio</label>
    </li>
    <li>
      <input type="checkbox" name="dew" value="dew" id="dew" checked>
      <label for="dew">Sempronio</label>
    </li>
  </ul>

  <hr>

  <strong>ESEMPIO PULSANTE DI INVIO</strong>
  <p>
    <input type="submit" value="Invia"><label>Invia il modulo</label>
    <br>
    <input type="reset" value="Reset"><label>Reimposta i campi</label>
  </p>

  <hr>
</form>
input:default + label {
  color: red;
  font-weight: bold;
}

* {
  font-family: sans-serif;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.