zad 8/ urok 1

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Forms</title>
</head>
<body>
<form>
    <fieldset>
        <legend>Customer Details </legend>
    <p>
        <label for="firstName" id="firstName">First Name
            <input autofocus type="text" placeholder="George">
        </label><br>
    </p>
    <p>
        <label for="lastName" id="lastName">Last Name
            <input autofocus type="text" placeholder="Devis">
        </label><br>
    </p>

        <label>
            <p>
            <input type="radio" name="gender" value="male"> Male
            <input type="radio" name="gender" value="female"> Female
            <input type="radio" name="gender" value="other"> Other
            </p>
        </label>

        <label>
            <p>
                Preferred contact method:
                <input type="radio" name="contact" value="mail"> Email
                <input type="radio" name="contact" value="phone"> Phone
            </p>
        </label>

    <p>
        <label for="emial" id="email">Email
            <input autofocus type="text" placeholder="your@email.com">
        </label><br>
    </p>
    <p>
        <label for="phone" id="phone">Phone
            <input autofocus type="number" placeholder="+359885236225">
        </label><br>
    </p>
    <p>
        <label for="town">Town
            <select id="town" name="town">
                <option value="Varna">Varna</option>
                <option value="Plovdiv">Plovdiv</option>
                <option value="Burgas">Burgas</option>
                <option value="Sofia">Sofia</option>
                <option value="Pleven">Pleven</option>
            </select>
        </label>
    </p>

    <p>
        <label for="age" id="age">Age
            <input type="number" id="age" name="age"
            min="18" max="70">
        </label>
    </p>

    <p>
        <label for="language">Programming language
            <input type="text" name="language" id="language" list="languages_type">
            <datalist id="languages_type">
                <option>Java</option>
                <option>PHP</option>
                <option>C#</option>
                <option>JavaScript</option>
                <option>Python</option>
                <option>Ruby</option>
                <option>Other</option>
            </datalist>
        </label>
    </p>

    <p>
        <label>
            <textarea rows="5" cols="20">More information...
            </textarea>
        </label>
    </p>

    <p>
        <input type="checkbox" id="check" name="check" checked>
        <label for="check">I agree the Terms and Conditions </label>
    </p>

    <p>
        <label>
         <input type="submit" value="Send">
        </label>
    </p>

    </fieldset>

</form>
</body>
</html>