Development Wall

help for php, codeigniter, javascript, jquery, mysql, apache, ubuntu

HTML5 Basics

• May 4th, 2012
• Category: html5

HTML5 is the latest version of HTML and XHTML. HTML5 makes  things very simple but its powerful.
I will show some very basic tag for HTML5

1. The document Type(Doctype) Declaration:

The HTML <!DOCTYPE> is used  to  specify  which version and language the document is using.

Before (Xhtml):


After (html5):


It will work in older browsers too. This is not only for html5, it’s also for earlier version of html.

2.    Meta Charset:

Before (Xhtml):


After:


3.    Scripts and Links:

Before (Xhtml):

<script type="text/javascript" src="script.js"></script>

After (html5):

</pre>

<script type="text/javascript" src="script.js"></script>

Here the type attribute is removed

4.    Form  Input Type:

<input id="email" type="email" name="email" />                 <!-- email  type for select email with validation -->
<input type="color" name="txtcolor" />                          <!--color type for select color -->
<input type="tel" name="usrtel" />                             <!-- tel field is  for telephone number -->
<input type="date" name="bday" />                                 <!--date type for select date-->
<input type="datetime" name="txtdatetime" />                     <!--datetime type for select date-->
<input type="month" name="txtmonth" />                         <!-- month type for select month-->
<input type="number" name="quantity" />        <!--quantity  type for  numeric field-->
<input type="search" name="googlesearch" />                  <!-- search type for search-->

5. Placeholder:


<input type="text" name="search" />

Use placeholder attribute. you don’t need JavaScript  for this event.

html5_place_holder

One Response »

  1. Cooler Post :-) Wo ist der Facebook Button?

Leave a Reply