Download presentation
Presentation is loading. Please wait.
Published byStuart Fields Modified over 8 years ago
1
FORMS How to collect information f XX rom visitors Different kinds of form controls New HTML5 form controls
2
FORMS Traditionally a printed document HTML borrows the concept of a form to refer to different elements that allow you to collect information from visitors to your site How to create a form on your website The different tools for collecting data New HTML5 form controls
3
WHY FORMS?
4
FORM CONTROLS
6
Form Controls
7
HOW FORMS WORK
8
FORMS
9
FORM STRUCTURE
10
TEX T INPUT
11
PASSWORD INPUT
12
TEXT AREA
13
RADIO BUTTON
14
CHECKBOX
15
DROP DOWN LIST BOX
16
MULTIPLE SE LECT BOX
17
FILE INPUT BOX
18
SUBMIT BUTTON
19
IMAGE BUTTON
20
BUTTON & HIDDEN CONTROLS
21
LABELLING FORM CONTROLS
22
GROUPING FORM ELEMENTS
23
HTML 5: FORM VALIDA TION
24
HTML 5: DATE INPUT
25
HTML 5: EMAIL & URL INPUT
26
HTML 5: SEARCH INPUT
27
EXAMPLE FORMS This example shows a feedback and newsletter sign-up form. It uses a variety of form controls
28
SUMMARY Whenever you want to c XX ollect information from visitors you will need a form, which lives inside a element. Information from a form is sent in name/value pairs. Each form control is given a name, and the text the user types in or the values of the options they select are sent to the server. HTML5 introduces new form elements which make it easier for visitors to fill in forms
29
EXTRA MARKUP Specifying different versions of HTML Identifying and grouping elements Comments, meta information and iframes
30
TAGS At this point, we have covered the main tags that fit nicely into groups and sections. The different versions of HTML and how to indicate which version you are using How to add comments to your code Global attributes, which are attributes that can be used on any element, including the class and id attributes Elements that are used to group together parts of the page where no other element is suitable
31
TAGS How to embed a page within a page using iframes How to add information about the web page using the element Adding characters such as angled brackets and copyright symbols
32
THE EVOLUTION OF HTML HTML 4 XHTML 1.0 HTML5
33
DOCTYPES
34
COMMENTS IN HT ML
35
ID ATTRIBUTE
36
CLASS ATTRIBUTE
37
BLOCK ELEMENTS
38
INFORMATION ABOUT YOUR PAGE S Description Keywords robots
39
SUMM ARY DOCTYPES tell browsers which version of HTML you are using You can add comments to your code between the markers The id and class attributes allow you to identify particular elements. The and elements allow you to group block-level and inline elements together. cut windows into your web pages through which other pages can be displayed The tag allows you to supply all kinds of information about your web page Escape characters are used to include special characters in your pages such as, and ©
Similar presentations
© 2024 SlidePlayer.com. Inc.
All rights reserved.