0% found this document useful (0 votes)
12 views19 pages

Coding & Tech Lesson 21 Slides

The document provides an overview of HTML input types and their usage in creating interactive websites through forms. It outlines various input types such as text, checkbox, radio, and email, explaining their functions and purposes. Additionally, it emphasizes the importance of forms for capturing user data and highlights the flexibility and data validation capabilities of HTML forms.
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
12 views19 pages

Coding & Tech Lesson 21 Slides

The document provides an overview of HTML input types and their usage in creating interactive websites through forms. It outlines various input types such as text, checkbox, radio, and email, explaining their functions and purposes. Additionally, it emphasizes the importance of forms for capturing user data and highlights the flexibility and data validation capabilities of HTML forms.
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd

Diploma in

Coding and Technology

Lesson: HTML inputs


Working with HTML input types
Creating HTML forms
Practical session

Objectives
Loading…
HTML input
Using input elements enables
developers to create interactive
websites. To create an input element,
we use the <input> tag and specify the
type of input using the “type” attribute.
Captures data Used to parse
from user for data to the
processing back-end

Why use HTML


input elements?
Shape the
client and
server
response
HTML input types
Input type Description
Button A clickable button.
Text A text field that accepts a single line of text.
Checkbox A checkbox that allows users to select/deselect single values.
Radio A clickable radio checkbox that allows users to a single value from a list of
options with the same named value.
Password A single line text field that hides the values entered by the user.
Range Enables users to select between a maximum and minimum range.
Submit A clickable button that submits form data.
Date and time Generates a simple UI which allows users to select a time and date.
Email A text field that accepts a single line of text. The text is treated as an email
address and uses validation parameters.
Text
Buttons
Checkboxes
Radios
Range
Email
Password
Date and time
Loading…
HTML forms
Forms allow the client to capture
data from the user. The HTML
<form> element defines a form that
is used to collect user input or data.

• Data validation
• Operations outside of HTML
• Highly flexible
Login form
example
Loading…
Let’s code!

You might also like