Question

In: Computer Science

Create a form using the following HTML elements at a minimum. Style the form in your...

Create a form using the following HTML elements at a minimum. Style the form in your CSS. You do not need to include a form action (i.e. the form doesn't have to do anything - we're designing the front end of the form).


textarea


textbox


input type of "email"


select


radio button


checkbox


submit button


style at least three elements of your form in your stylesheet, including your submit button


Use a comment to delineate the beginning and end of the section of CSS used in for this form to explain what it is for future webmasters of your site.

Solutions

Expert Solution

HTML file :registers.html

<!DOCTYPE html>

<html lang="en">

    <head>

        <!-- title for web page -->

        <title></title>

        <meta charset="UTF-8">

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

        <!-- Internal Stylesheet -->

        <style>

            /* style for body */

            body{

                background-color: aqua;

            }

            /* styles for labels */

            label{

                display: block;

                margin-top: 10px;

                font-weight: bold;

                font-size: 16px;

                font-style: italic;

            }

            /* style for button */

            input[type='submit'],input[type='reset']

            {

                color: white;

                background-color: maroon;

            }

            /* style for texbox */

            input[type='text']

            {

                border: 2px solid green;

            }

            /* style for form */

            form{

                padding: 25px;

                width: 500px;

                border: 2px solid red;

            }

        </style>

    </head>

    <body>

    <form>

        <h1>Registration Form</h1>

        <!-- label for the name -->

        <label for="name">Name </label>

        <!-- textbox for name -->

        <input type="text" id="nameTextbox" name="name"/>

        <!-- label for the address -->

        <label for="address">Address </label>

        <!-- textbox for Address -->

        <textarea id="AddressTextarea" rows="5" cols="23" name="Address"></textarea>

         <!-- label for the gender -->

         <label for="gender">Gender </label>

         <!-- radio button for gender -->

         <input type="radio" id="maleRadio" name="gender"/>Male

         <input type="radio" id="femaleRadio" name="gender"/>Female

         <!-- label for the email -->

        <label for="email">Email </label>

        <!-- input type=email -->

        <input type="email" id="emailTextbox" name="email"/>

         <!-- label for the location -->

         <label for="location">Location </label>

         <!-- select element -->

         <select id="ddlLocation" name="location">

             <option value="--Select--" readonly>--Select--</option>

             <option value="India">India</option>

             <option value="USA">USA</option>

             <option value="UK">Uk</option>

             </select>

              <!-- label for the Education -->

         <label for="education">Education </label>

         <!-- checkbox  for education -->

         <input type="checkbox" id="schoolCheckbox" name="education"/>School

         <input type="checkbox" id="secondaryCheckbox" name="education"/>Secondary

         <input type="checkbox" id="ugCheckbox" name="education"/>UG

         <input type="checkbox" id="pgCheckbox" name="education"/>PG

        <br><br>

         <!-- button to submit form -->

         <input type="submit"/>

         <!-- button to rest form -->

         <input type="reset"/>

    </form>

    </body>

</html>

==========================================

Output :


Related Solutions

Using brackets you will need to create the HTML page and CSS style sheet for the...
Using brackets you will need to create the HTML page and CSS style sheet for the given Form example. Form 1: create an HTML page with a form that contains a text input field. The label for the text field should be “City”. Beneath it should be a submit button “Lookup”. Place a horizontal line beneath the Lookup button and add three radio buttons labeled “Beginner”, “Intermediate”, and “Advanced”. Your page should have a title and a header in the...
this is done in HTML In footer, use HTML tags/style of your choice to explain steps...
this is done in HTML In footer, use HTML tags/style of your choice to explain steps you took to add css file and _Layout. Should include the following: Folder structure Short description of what layout does You should not include the content of css or how you defined your css
using PDO, MYSQL, and Html, how can i create a simple registration and login form for...
using PDO, MYSQL, and Html, how can i create a simple registration and login form for cPanel?
- Create an html form (bank form) and the PHP code with 2 accounts with options...
- Create an html form (bank form) and the PHP code with 2 accounts with options to transfer, deposit or withdraw money.
Overview Students will learn how to use block-level <div> elements in HTML and style them with...
Overview Students will learn how to use block-level <div> elements in HTML and style them with CSS to transform them using various properties such as: position top, left, right, bottom float border border-radius background-color etc. Related Lecture(s) Module 2: Lecture #3 - The Box Model & Positioning Elements Basic Content Create a folder on your local machine in the "csis1430/htdocs" folder called "little-boxes" with the following folder structure: css img js Create an index.html file with multiple (as many as...
Create an HTML form with the following: 2 text input fields 1 text area 2 radio...
Create an HTML form with the following: 2 text input fields 1 text area 2 radio buttons or 3 checkboxes 1 button Include labels for fields
HTML Create a page of texts that uses inline elements. The page should contain a citation,...
HTML Create a page of texts that uses inline elements. The page should contain a citation, a term definition, a subscript, a superscript and some highlighted texts.
For all img elements create a style rule that applies a sepia filter with a value...
For all img elements create a style rule that applies a sepia filter with a value of 1. Add a black box shadow with horizontal and vertical offsets of 0 pixels and a blur radius of 20 pixels. Create the following style rules for the five image elements: For the img1 image, translate the image -150 pixels along the z-axis. For the img2 image, rotate the image 90 degrees around the x-axis and translate the image -150 pixels along the...
write php code for buying and selling web using sql, javascript ,html ,css style
write php code for buying and selling web using sql, javascript ,html ,css style
Create an ASP.NET Core MVC solution, edit the main view to contain an HTML form that...
Create an ASP.NET Core MVC solution, edit the main view to contain an HTML form that asks for first name, last name, and email address. The form should also have a submit button, though the submit button doesn't have to do anything yet. looking for an HTML mockup inside an ASP.NET Core MVC Solution.
ADVERTISEMENT
ADVERTISEMENT
ADVERTISEMENT