Wiederholung - Formulare #1

Teil des Abschnitts Grundlagen der HTML-Journey von Coddy. Lektion 46 von 60.

Aufgabe

Einfach

Lass uns mithilfe von HTML ein einfaches Bestellformular für Getränke erstellen, wie im Bild unten gezeigt.

Das sollte enthalten sein:

Ein <form>-Tag, der alles umschließt.
Eine Gruppe von Optionsfeldern (Name: "drink"), damit Nutzer ihr Getränk auswählen können. Die Beschriftungen sollten "Water", "Coke" oder "Sprite" sein.
Eine Gruppe von Kontrollkästchen (Name: "extras") für optionale Zusätze. Die Beschriftungen sollten "Ice", "Lemon" oder "Sugar" sein.
Ein Dropdown-Menü (Name: "size"), um die Größe eines Getränks auszuwählen. Die Optionen sollten "Small", "Medium" oder "Large" sein.
Eine Absende-Schaltfläche mit der Beschriftung "Place Order".
Eine Zurücksetzen-Schaltfläche mit der Beschriftung "Clear".

⚠️ Wichtig: Verwende nur ein <form>-Tag. HTML erlaubt keine verschachtelten <form>-Tags: Ein <form> innerhalb eines anderen <form> zu platzieren, ist ungültig und führt dazu, dass deine Eingabefelder außerhalb des Formulars erkannt werden, wodurch die Tests fehlschlagen. Platziere alle Optionsfelder, Kontrollkästchen, das Dropdown-Menü und die Schaltflächen direkt innerhalb des einzelnen äußeren <form>: Umschließe Abschnitte nicht mit zusätzlichen <form>-Tags.

Probier es selbst

<!DOCTYPE html>
<html>
    <body>
        <form>
            <p>Select a drink: </p>
            <!-- Schreibe hier Code -->
            
            <p>Select extras: </p>
            <!-- Schreibe hier Code -->
            
            <p>Select size: </p>
            <!-- Schreibe hier Code -->
            
        </form>
    </body>
</html>