Powtórzenie — formularze nr 1

Część sekcji Podstawy ścieżki HTML w Coddy. Lekcja 46 z 60.

Wyzwanie

Łatwy

Zbudujmy prosty formularz zamówienia napoju w HTML, jak pokazano na poniższym obrazku.

Oto, co należy uwzględnić:

Znacznik <form>, który obejmuje całość.
Grupę przycisków opcji (name: "drink"), aby umożliwić użytkownikom wybór napoju. Etykiety powinny brzmieć "Water", "Coke" lub "Sprite".
Grupę pól wyboru (name: "extras") dla opcjonalnych dodatków. Etykiety powinny brzmieć "Ice", "Lemon" lub "Sugar".
Menu rozwijane (name: "size") do wyboru rozmiaru napoju. Opcje powinny brzmieć "Small", "Medium" lub "Large".
Przycisk wysyłania z etykietą "Place Order".
Przycisk resetowania z etykietą "Clear".

⚠️ Ważne: Użyj tylko jednego znacznika <form>. HTML nie pozwala na zagnieżdżanie znaczników <form>: umieszczenie jednego <form> wewnątrz drugiego jest nieprawidłowe i sprawi, że pola formularza zostaną wykryte poza formularzem, co spowoduje niepowodzenie testów. Umieść wszystkie przyciski opcji, pola wyboru, menu rozwijane i przyciski bezpośrednio wewnątrz pojedynczego zewnętrznego znacznika <form>: nie umieszczaj sekcji w dodatkowych znacznikach <form>.

Spróbuj swoich sił

<!DOCTYPE html>
<html>
    <body>
        <form>
            <p>Select a drink: </p>
            <!-- Wpisz kod tutaj -->
            
            <p>Select extras: </p>
            <!-- Wpisz kod tutaj -->
            
            <p>Select size: </p>
            <!-- Wpisz kod tutaj -->
            
        </form>
    </body>
</html>