0% found this document useful (0 votes)
2 views8 pages

HTML Forms - Lecture 6

The document explains the structure and components of HTML forms, highlighting the <form> element as the container for various input types. It details the <input> element, which can represent text fields, checkboxes, radio buttons, and submit buttons, among others. Examples are provided to illustrate how to create text inputs and checkboxes within a form.

Uploaded by

cultoonmovic4
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
2 views8 pages

HTML Forms - Lecture 6

The document explains the structure and components of HTML forms, highlighting the <form> element as the container for various input types. It details the <input> element, which can represent text fields, checkboxes, radio buttons, and submit buttons, among others. Examples are provided to illustrate how to create text inputs and checkboxes within a form.

Uploaded by

cultoonmovic4
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
You are on page 1/ 8

HTML FORMS

HTML Forms
The <form> Element
The HTML <form> element defines a form that is used to collect user input:
<form>
form element
</form>

An HTML form contains form elements


Form elements are different types of input elements, like text fields, checkboxes, radio
buttons, submit buttons, and more.

NCICT - Basic HTML Web Programming 1


HTML FORMS

To create an HTML form, we will use


the HTML <form> element. It starts
with the <form> tag and ends with the
</form> tag. We can add the input
elements within the form tags for taking
user input. form elements, such as text
box, radio button, submit button, tick
box etc. NCICT - Basic HTML Web Programming 2
The <input> Element
 The <input> element is the most important
form element.
The <input> element can be displayed in several ways, depending on the type attribute.

Here are some examples:


TYPE DESCRIPTION

<input type=“text” Defines a one-line input field

NCICT - Basic HTML Web Programming 3


FORM ELEMENT

Here are some examples:

TYPE DESCRIPTION

<inputtype=“radio” Defines the radio button


(for selecting one of many
choices).

TYPE DESCRIPTION

<inputtype=“submit Defines the submit button


” (for submitting the form).

NCICT - Basic HTML Web Programming 4


HTML FORMS
TEXT INPUT
<input type=”text”> defines a one line input for text
input:
Example
<form>
TEXT BOX
First Name: <input type=”text” name=”firstname”
place holder e.g Sandra>
Last Name: <input type=”text” name=” lastname”>
</form> NCICT - Basic HTML Web Programming 5
HTML FORMS

NCICT - Basic HTML Web Programming 6


HTML FORMS
CHECK BOX INPUT
Check box Input
<input type=”check box”> defines a check box:

Checkbox <br>
Uganda: <input type="checkbox" name="checkbox” value="checkbox" checked><br>
Kenya: <input type="checkbox" name="checkbox” value="checkbox" >

NCICT - Basic HTML Web Programming 7


HTML FORMS
The Submit Button
<input type=”submit”> defines a button for submitting the form data to a form handler.
The form-handler is typically a server page with a script for processing input data.
The form-handler is specified in the form’s action attribute:
Example
<form action=”submit”/action_page.php”>
A submit button:
<input type="submit" name="Submit" value="Submit">

◼ A reset button:
<input type="reset" name="Submit2" value="Reset">
◼ A plain button:
<input type="button" name="Submit3" value="Push Me">
</form>
NCICT - Basic HTML Web Programming 8

You might also like