Özet - Formlar #1

Coddy'nin HTML Journey'sinin Temeller bölümünün bir parçası. Ders 46 / 60.

Görev

Kolay

Aşağıdaki resimde gösterildiği gibi, HTML kullanarak basit bir içecek sipariş formu oluşturalım.

Şunları ekle:

Her şeyi kapsayan bir <form> etiketi.
Kullanıcıların içeceklerini seçmesini sağlayan bir radyo düğmesi grubu (name: "drink"). Etiketler "Water", "Coke" veya "Sprite" olmalı. Her radyo düğmesine, etiketinin küçük harfli biçimi olan bir id ver: "water", "coke", "sprite".
İsteğe bağlı eklemeler için bir onay kutusu grubu (name: "extras"). Etiketler "Ice", "Lemon" veya "Sugar" olmalı. Her onay kutusuna, etiketinin küçük harfli biçimi olan bir id ver: "ice", "lemon", "sugar".
İçecek boyutunu seçmek için bir açılır menü (name: "size"). Seçenekler "Small", "Medium" veya "Large" olmalı.
Etiketi "Place Order" olan bir gönder düğmesi.
Etiketi "Clear" olan bir sıfırlama düğmesi.

⚠️ Önemli: Yalnızca bir <form> etiketi kullan. HTML, iç içe <form> etiketlerine izin vermez: bir <form> etiketini başka bir <form> etiketinin içine yerleştirmek geçersizdir ve girişlerin formun dışında algılanmasına, dolayısıyla testlerin bozulmasına neden olur. Tüm radyo düğmelerini, onay kutularını, açılır menüyü ve düğmeleri doğrudan tek dış <form> etiketinin içine yerleştir: bölümleri fazladan <form> etiketleriyle sarmalama.

Kendin dene

<!DOCTYPE html>
<html>
    <body>
        <form>
            <p>Select a drink: </p>
            <!-- Kodu buraya yazın -->
            
            <p>Select extras: </p>
            <!-- Kodu buraya yazın -->
            
            <p>Select size: </p>
            <!-- Kodu buraya yazın -->
            
        </form>
    </body>
</html>