Ein Formular braucht am Ende einen Weg, es abzuschicken. Dafür gibt es Buttons - und genauer gesagt, drei verschiedene Arten davon.

input type="submit": der Absenden-Knopf

<input type="submit" value="Absenden">

Bei type="submit" ist value nicht der zu übermittelnde Wert wie sonst, sondern der Text, der auf dem Button angezeigt wird. Ein Klick auf diesen Button versucht, das Formular abzuschicken.

Das <button>-Element

Es gibt auch ein eigenes <button>-Element, das dasselbe bewirkt, aber flexibler ist, weil der Text zwischen den Tags steht statt in einem Attribut - so kannst du zum Beispiel auch andere Elemente hineinpacken:

<button type="submit">Nachricht senden</button>

Die drei Button-Typen

Sowohl <input> als auch <button> kennen drei mögliche type-Werte:

• type="submit": schickt das Formular ab (das ist auch der Standardwert für <button>, wenn du gar kein type angibst - deshalb ist es besser, ihn immer ausdrücklich zu schreiben).
• type="reset": setzt alle Felder im Formular auf ihren ursprünglichen Zustand zurück.
• type="button": tut von sich aus gar nichts - dieser Typ ist nur dazu gedacht, später mit JavaScript eine eigene Aktion auszulösen (nicht Teil dieses Tutorials).

Finns Formular mit einem Absenden-Knopf fertigstellen

<form>
  <p>
    <label for="vorname">Dein Vorname:</label><br>
    <input type="text" name="vorname" id="vorname" required>
  </p>

  <p>
    <label for="email">Deine E-Mail:</label><br>
    <input type="email" name="email" id="email" required>
  </p>

  <p>
    <label for="nachricht">Deine Nachricht:</label><br>
    <textarea name="nachricht" id="nachricht" rows="5" cols="40"></textarea>
  </p>

  <button type="submit">Nachricht senden</button>
</form>

Klicke im Browser auf den Button. Du wirst sehen, dass sich die Seite kurz neu lädt (oder eine Fehlermeldung des Browsers zeigt, falls Pflichtfelder leer waren) - das ist normal, weil noch kein Server im Hintergrund die Daten wirklich verarbeitet.