Location via proxy:   [ UP ]  
[Report a bug]   [Manage cookies]                
Scribd Logo
Upload

Welcome to Scribd!

  • 24 views

    Name: Mohamed G Kanu

    Uploaded by

    Mohamed Gibrilla Kanu
    This document contains the code for a survey form with fields for name, email, age, interests, favorite Pokémon, communication preferences, and additional comments. The form is contained within a <main> element with styling to center and style the form, and includes labels, text and select inputs, radio buttons, checkboxes, and a submit button. The form is intended as a proof of concept and submitting it will not actually transmit the data.

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd

    Name: Mohamed G Kanu

    Uploaded by

    Mohamed Gibrilla Kanu
    24 views6 pages
    This document contains the code for a survey form with fields for name, email, age, interests, favorite Pokémon, communication preferences, and additional comments. The form is contained within a <main> element with styling to center and style the form, and includes labels, text and select inputs, radio buttons, checkboxes, and a submit button. The form is intended as a proof of concept and submitting it will not actually transmit the data.

    Original Title

    Untitled

    Copyright

    © © All Rights Reserved

    Available Formats

    DOCX, PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    This document contains the code for a survey form with fields for name, email, age, interests, favorite Pokémon, communication preferences, and additional comments. The form is contained within a <main> element with styling to center and style the form, and includes labels, text and select inputs, radio buttons, checkboxes, and a submit button. The form is intended as a proof of concept and submitting it will not actually transmit the data.

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd
    Download as docx, pdf, or txt
    24 views6 pages

    Name: Mohamed G Kanu

    Uploaded by

    Mohamed Gibrilla Kanu
    This document contains the code for a survey form with fields for name, email, age, interests, favorite Pokémon, communication preferences, and additional comments. The form is contained within a <main> element with styling to center and style the form, and includes labels, text and select inputs, radio buttons, checkboxes, and a submit button. The form is intended as a proof of concept and submitting it will not actually transmit the data.

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd
    Download as docx, pdf, or txt
    You are on page 1of 6

    NAME: ……………………… MOHAMED G KANU

    DEPARTMENT: ……………………. COMPUTER SCIENCE

    LEVEL: ……………………………. YEAR 2

    MODULE: ………………………….. WEB DEVELOPMENT

    LAB: ………………….. 1
    <!DOCTYPE html>

    <!DOCTYPE html>

    <html lang="en">

    <head>

    <meta charset="UTF-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>survey form</title>

    </head>

    <body>

    <h1>Survey Form</h1>

    <p>The card below was built as a sample survey form for freeCodeCamp.</p>

    <main id="main">

    <h1 id="title">Join the Togepi Fan Club!</h1>

    <p id="description">

    Enter your information here to receive updates about club activities,

    our monthly newsletter, and other email communications.

    </p>

    <form id="survey-form" action="#">

    <label for="name" id="name-label"

    ><p>Name:</p>

    <input type="text" id="name" placeholder="e.g. John Smith" required />

    </label>

    <label for="email" id="email-label"

    ><p>Email:</p>

    <input

    type="email"

    id="email"

    placeholder="e.g. john.smith@email.com"
    required

    />

    </label>

    <label for="age" id="number-label"

    ><p>Age<em>(optional)</em>:</p>

    <input

    type="number"

    id="number"

    placeholder="e.g. 19"

    min="18"

    max="99"

    />

    </label>

    <label for="interest" id="interest-label"

    ><p>What are you most interested in?</p>

    <select id="dropdown">

    <option selected disabled hidden></option>

    <option id="battles">Battling</option>

    <option id="breeding">Breeding</option>

    <option id="catching">Completing my Pokedex</option>

    <option id="exploring">Exploring new regions</option>

    </select>

    </label>

    <p>Who is your favourite Pokemon?</p>

    <label for="togepi">

    <input

    id="togepi"

    type="radio"

    name="favorite"
    value="togepi"

    />Togepi!

    </label>

    <label for="pikachu">

    <input

    id="pikachu"

    type="radio"

    name="favorite"

    value="pikachu"

    />Pikachu

    </label>

    <label for="other">

    <input id="other" type="radio" name="favorite" value="other" />Other

    </label>

    <p>Which communications do you want to receive?</p>

    <label for="newsletter">

    <input

    id="newsletter"

    type="checkbox"

    name="communications"

    value="newsletter"

    />Newsletter

    </label>

    <label for="events">

    <input

    id="events"

    type="checkbox"

    name="communications"

    value="events"
    />Event updates

    </label>

    <label for="updates">

    <input

    id="updates"

    type="checkbox"

    name="communications"

    value="updates"

    />Club updates

    </label>

    <p>Any other information you would like to share?</p>

    <textarea id="additional-information" rows="4" cols="50">

    You can provide comments, suggestions, or feedback here.</textarea

    >

    <p>

    <em

    >Please note: This form is a proof of concept. Submitting the form

    will not actually transmit your data.</em

    >

    </p>

    <button type="Submit" id="submit">Submit</button>

    </form>

    </main>

    </body>

    <footer>

    <a href="../">Return to Project List</a> |

    <a href="https://www.nhcarrigan.com">Return to HomePage</a>

    </footer>

    </html>
    main {

    text-align: center;

    background-color: #92869c;

    background-blend-mode: lighten;

    max-width: 500px;

    margin: 20px auto;

    border-radius: 50px;

    box-shadow: 10px 10px rgba(0, 0, 0, 0.5);

    color: black;

    body {

    text-align: center;

    background: #3a3240;

    color: white;

    input, textarea, select, button {

    background: #3a3240;

    color: white;

    a{

    color: white;

    </body>

    </html>

    You might also like