HTML5
1.1 Advanced Web Designing
1. HTML is an evolving lanuguage with different versions supporting different features.
2. HTML5 supports mobile technology.
3. List of major broeswers supporting HTML5 are Google Chrome,Mozilla
.
Firefox,Microsoft Edge,Safari,Opera and Apple
1.2 Forms in HTML
1. Different types of controls like text,textarea,select,radio button,checkbox,submit and
reset are studied in eleventh standard.
2. Above controls were used to collect different kinds of inputs from user like
name ,age,phone number or selecting one or more options from group of options like
standard,subjects or address (using textarea)or date of birth (using select) or
subitting(submit button control will submit data to server name specified in action
attribute of<form> tag) or clearing(reset control is used to clear data) etc.
3. Additional form controls are introduced in HTML5 for validation purpose.
ADVANCED INPUT TAGS
<input type=“color”> define a color picker
The elements of type color provide a user interface element that lets a user specify a color,
either by using a visual color picker interface or by entering the color into a text field in
#rrggbb hexadecimal format. Only simple colors (without alpha channel) are allowed
though CSS colors has more formats, e.g. color names, functional notations and a
hexadecimal format with an alpha channel.
The element's presentation may vary substantially from one browser and/or platform to
another—it might be a simple textual input that automatically validates to ensure that the
color information is entered in the proper format, or a platform-standard color picker, or
some kind of custom color picker window.
<input type=”number”> Defines a field for entering a number
The elements of type number are used to let the user enter a number. They include built-in
validation to reject non-numerical entries.
<input type=“url”> Defines a field for entering a url
The elements of type number are used to let the user enter a number. They include built-in
validation to reject non-numerical entries.
<input type= “image”> Defines a image as submit button
The elements of type image are used to create graphical submit buttons, i.e. submit
buttons that take the form of an image rather than text.
<input type=”date”> Defines a date picker with the year , month and date
The elements of type="date" create input fields that let the user enter a date,
either with a textbox that validates the input or a special date picker interface.
<input type=”email”> Defines a email address
The elements of type email are used to let the user enter and edit an email
address, or, if the multiple attribute is specified, a list of email addresses.
Input Restrictions
Attributes Description
Disabled Specifies that the input field should be disabled.
Max Specifies the maximum value for the input field.
Min Specifies the minimum value for the input field.
Pattern Specifieds that the regular expression is to check input values.
Read only Specifies that the input field is read only.(canot be changed)
Place This acts as a temporary field showing the purpose of the text field.
holder
Required Specifies that the <input> field is required.
Auto Specifies whether a from or input field should have auto complete on or off.
complete
Auto focus Specifies that the >input> field automatically gets focus when the page loads.
Height Specifies the width and height of the image.
and width
multiple Specifies that the user is allowed to enter more than one value in the <input> element.
