Popular Posts

What’s New in HTML5 form

New in HTML5 form:-

The Basic html forms contains of following elements.

     1. Button
     2. Submit
     3. Reset
     4. Text
     5. Checkbox
     6. Radio

HTML5 introduces the following new control types into form

1.      Date
2.      DateTimeLocal
3.      Week
4.      Month
5.      Year
6.      Email
7.      Url
8.      File
9.      Color
10.  Range
11.  Number etc….

New attributes

1.      Required
2.      Placeholder
3.      Readonly

EX:-

<!DOCTYPE html>
<html>
<head></head>
<body>
<form name=”frmregister”>
<h1 align=”center”>Registration form</h1>
<table aline=”center” width=”400”>
<tr>
<td>User Name</td>
<td><input type=”text” request Placeholder=”User Name”></td>
</tr>
<tr>
<td>Date of Birth</td>
<td><input type=”date”></td>
</tr>
<tr>
<td>Age</td>
<td><input type=”number”></td>
</tr>
<tr>
<td>Price Range</td>
<td><input type=”range”></td>
</tr>
<tr>
<td>Select Shirt Color</td>
<td><input type=”color”></td>
</tr>
<tr>
<td>Upload Photo</td>
<td><input type=”file”></td>
</tr>
<tr><td>Email</td>
<td><input type=”email”></td>
</tr>
<tr>
<td>&nbps</td>
<td><input type=”Submit”value=”submit”>
</td>
</tr>
</table>
</form>
</body>
</html>

What is New in HTML5 Document Structure

New in HTML5 Document Structure


              HTML5 introduces   is New Document Structure that makes the web application and the web site more SEO (search Engine option) friendly.

            The following are the new elements. Introduced into HTML5 document Structure.

Article
Contains Information about the website.
Aside
Contains Information that is not relevant to the web.
Section
Contains Information that is to be displayed in the body.
Nav
Defines the Navigation Bar.
Menu
Contains the navigation Bar.
Figure
Set a Picher or table with caption.
Header
Defines the content to be displayed in the page header.
Footer
Content to be displayed in the page footer.

Sample Program:-

<! DOCTYPE html>
<html>
<head></head>
<body>
<header>
<menu>
<nav>Home | About |Contact <\nav>
</menu>
</header>
<section>
<h1> Google </h1>
<article>Special New Year offer…………</arical>
<aside>reliance fresh……….</aside>
</section>
<footer>
&copy Copyright 2015
</footer>
</body>

</html>