learn html 5 in 3 days – day 1 - codeproject

11,332,218 members (40,585 online) 459 Sign out

Member 11342613

home quick answers discussions features community help

Articles » Web Development » ASP.NET » General

Article

Browse Code

Stats

Revisions (8)

Alternatives

Comments (82)

Add your ownalternative version

Tagged as

Related Articles

A Professional HTMLRenderer You WillUse

Learn MVC (ModelView Controller) stepby step in 7 days –Day 1

Learn MVC 5 step bystep in 7 days – Day1

Learn MVC (Modelview controller) Stepby Step in 7days –Day 6

Reviews of Two NewBooks from O'Reillyabout HTML andJavaScript

Info

Best Web Dev Articleof October 2014(Second Prize)

First Posted 9 Oct 2014

Views 8,063

Downloads 8,308

Bookmarked 308 times

Research

Securing CloudApps with aDistributed Web...

Error monitoring:The Key toInnovative...

C#

ASP.NET

HTML

Beginner

Application

validation

Cache

VS2013

HTML5/CSS3

Marla Sukesh, 24 Mar 2015 CPOL

Learn HTML 5 in 3 days – Day 1

Welcome to day 1 of Learn HTML 5 in 3 days article series

Download NewFormElements.zip - 27.3 KB

Download Datalist.zip - 26.9 KB

Download output.zip - 26.9 KB

Download Validation_using_type_attri bute.zip - 27.2 KB

Download Validation_using_other_validation_attributes.zip - 27.1 KB

Download Customizing_validation.zip - 27.4 KB

Download OfflineApp.zip - 21 KB

Download OfflineAppAdvanced.zip - 23.7 KB

IntroductionHTML 5 is one of the hot topic in recent days. So I decide to writea complete learning tutorial about same. It’s going to be a 2 daysseries article. We will start with very basic features and movetowards advanced features and scenario in step by step fashion.

Note: As a Microsoft guy whenever there is a need for server sidetechnology I will be using C# and Asp.Net.

What we won’t cover here?If you don’t know anything about HTML then this article is not for you. We won’t talk about break (<br>), Bold(<b>) tags here, rather we will look into new concepts in HTML 5.

You can learn about basic HTML here.

Complete ListDay 1Day 2 – Part 1Day 2 – Part 2 (coming soon)Day 3 – Part 3 (coming soon)

AgendaIntroduction to HTML 5

What is difference between SGML, HTML and XML?What is Doc type?How HTML 5 is different from previous versions?

HTML 5 New featuresLab 1 – Understanding new Page structure semanticsLab 2 – Demo with New Input attributes

New type valuesSome useful attributes

Lab 3 – Understanding HTML 5 Datalist controlLab 4 – Output elementLab 5, 6 and 7 – Understanding HTML 5 validation feature

4.82 (167 votes)

Rate: Vote!

articles

Learn HTML 5 in 3 days – Day 1 - CodeProject http://www.codeproject.com/Articles/827673/Learn-HTML-in-days-Day

1 of 18 3/28/2015 1:04 PM

Lab 5 – implement validation using “type” attribute of input elementLab 6 – Implementing validation using custom validation attributesLab 7 – Customizing validation

Lab 8, 9 and 10 and 11 - Application Cache in HTML 5

Lab 8 – Simple Application Cache DemoLab 9 – Solve the double refresh problemLab 10– Understand more about manifestLab 11 - Importance of NETWORK sectionApplication caching vs old browser caching

Summary

Introduction to HTML 5Let’s start with understainding some basic, intriguing and unaware terminologies and concepts.

What is difference between SGML, HTML and XML?What is Doc type?How HTML 5 is different?Understand HTML

What is difference between SGML, HTML and XML?

SGML stands for Standard Globalized Markup language is the one used for defining standard markuplanguages. In simple words it defines how a document should looks like.HTML stands for Hyper Text markup language is a standard Markup language based on SGML and it willbe used for creating Web Pages. Rules defining the markup is present inside a DTD and DTD is createdusing SGML.XML stands for Extensible markup language is derived from SGML and its purpose was cattering growingneed of internet. HTML had some limitations which was over came by XML. XML is simply a subset ofSGML which will be used for representing Data.

What is Doc type?

When you try to create a HTML page using tools like Dreamweaver or Visual studio you will find following line atthe top of the document always.

<!DOCTYPE HTML PUBLIC "‐//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

Have you ever wondered what it is?

It’s simply an instruction to the web browser about the version of HTML the page is written in. With doctype werefers a DTD which defines how HTML document should be structured, what all tags are allowed, what should bethe parent, what should be the child etc. In short DTD contain rules.

How HTML worked for me with Doctype then?

Most of the browser said “It’s ok if you won’t provide DTD. I can understand HTML well. I know itsrule and so I know how to render it”.

This is the reason why most of the developers are unaware about DTD and doctype.

How HTML 5 is different from previous versions?

HTML 5 is not based on SGML hence it won’t require DTD. It’s all together new markup language and have itsown parsing rules. Its specifications and syntaxes closely resembles with prior version but it’s all together a newlanguage.

In case of HTML 5 doctype is quite simple.

<!DOCTYPE html>

Now as per the w3.org “DOCTYPEs is required in top of every HTML document despite of its HTML4 or HTML 5.When omitted, browsers tend to use a different rendering mode that is incompatible with some specifications.Including the DOCTYPE in a document ensures that the browser makes a best-effort attempt at following therelevant specifications.”

HTML 5 New features


2 of 18 3/28/2015 1:04 PM

Main idea behind New HTML 5 feature is to provide standard in webdevelopment world.

From long time we are relying on many third party libraries/plugins toachieve some common functionalities like datepicker, animations,validations, playing videos and audios, offline browsing, client sidemulti-threading etc.,

Now we will be able to achieve many such functionalities in astandard way.

Note For beginners – Standard means, everyone will follow thesame approach in order to achieve something. Example – You will seesame validation code everywhere (in all future applications). Rightnow there is no standard. Someone is using jQuery validation whereas someone is using something else. But now onwards there will bestandard.

Let’s explore each of them one by one.

Lab 1 – Understanding new Page structure semanticsWhen we think about a Web UI what comes to your mind.

Header (not head tag – Header of a page), Footer, navigation bar, Content of page, images, Caption to thoseimages, a side bar etc.

You can see an alien image in the leftside and a normal boy image in the rightside.

Everyone can easily locate and identifyevery body part from the right side image,because it’s a standard. This is not a casewith left image.

Same logic applies when it comes to UIdevelopment.

Earlier HTML didn’t had standard tags or elements for defining different visible sections of a document suchas header of document, footer of a document, content of a document etc. Some people were using “div”decorated with some css styles and some were using “table…tr…td”. Problem with this approach wasinconsistency.

Now with HTML 5 we have support for standard tags such as Header, Footer, nav, FigCaption (figurecaption) etc., each of which will represent some special section.

These tags makes our markup a semantic markup.

Note: - This tag doesn’t provide any special advantages in rendering. They only makes our HTML structuremeaningful.


3 of 18 3/28/2015 1:04 PM

Lab 2 – Demo with New Input attributes

New type values

Earlier developer were using different libraries in order to get different UI elements such as datepicker, rangepicker, color picker etc.

Now HTML 5 brought standard by introducing new attributes to “type” attribute of input elements.

Let’s look at some of them.

Number

<input type="number" name="MyNuberElement" id="MyNumberElement" />

Range

<input type="range" name="MyRangeElement" id="MyRangeElement"/>

Color

<input type="color" id="MyColorElement" name="MyColorElement" />

Date

<input type="date" id="MyDateElement" name="MyDateElement" />

Time

<input type="time" id="MyTimeElement" name="MyTimeElement"/>

Datetime-local

<input type="datetime‐local" id="MyDateTimeLElement" name="MyDateTimeLElement" />


4 of 18 3/28/2015 1:04 PM

DateTime (Also include time zone)

<input type="datetime" id="MyDateTimeElement" name="MyDateTimeElement"/>

Month

<input type="month" id="MyMonthElement" name="MyMonthElement" />

Week

<input type="week" id="MyWeekElement" name="MyWeekElement" />

Some useful attributes

Autofocus

This attribute let us set initial focus on page load.

…

<label for="birthMonth">Birth Month</label>

<input type="month" id="MyMonthElement" name="MyMonthElement" autofocus />

…

This code makes focus to be set on “MyMonthElement” control element by default when page loads for the firsttime.

Note: In case “autofocus” is attached to multiple controls focus will be set on first control.

Placeholder


5 of 18 3/28/2015 1:04 PM

Let us set watermark on an input control.

<input type="text" placeholder="Enter Value" id="MyPlaceHolderControl"

name="MyPlaceHolderControl" />

Lab 3 – Understanding HTML 5 Datalist controlDatalist is a new tag in HTML 5 which will let us add autocomplete feature to an input textbox.

It’s a simple 3 step task.

Step 1 – Create Datalist

<datalist id="Hobbies">

<option>Reading books</option>

<option>Watching movies</option>

<option>Playing games</option>

</datalist>

Step 2 – Create input control and bind the list

<input type="text" name="TxtHobbies" value="" list="Hobbies" />

Step 3 –Execute and Test

Click here if you are interested in learning how to make datalist dynamic using Asp.net MVC.

Lab 4 – Output elementCalculation is the integral part of every application and sometime we often display those calcualted values in theUI. Before HTML 5 there was no standard element for displaying such results. Some people were using “span”,somewhere using “div” whereas some were using “disabled input textbox”.

It will be very difficult for anyone to understand the purpose of a tag/element/control just by looking at it.

In HTML 5 this problem is solved by introduction of a standard and semantic markup called “Output”.

<div oninput=

"document.getElementById(MyOutputElement).value =

(document.getElementById('input1').valueAsNumber) +

(document.getElementById('input2').valueAsNumber)">

<input id="input1" name="input1" type="number" value="1"> +

<input id="input2" name="input2" type="number" value="2"> =

<output id="MyOutputElement">3</output>

</div>

Note: Just like to lab2 markups, Output element won’t provide any special advantage other than addingsemantic meaning to our UI.

Lab 5, 6 and 7 – Understanding HTML 5 validationfeatureValidation is one of the most important features from the day 1 of application development. For implementingvalidation we have been using many libraries such as jQuery validation, live validation etc.


6 of 18 3/28/2015 1:04 PM

But now validation code will become a standard code with the help of new HTML 5 validation support.

Lab 5 – implement validation using “type” attribute of input element

Step 1 – Create Form tag and add different input elements as follows

<form>

<table>

<tr>

<td>

<label>E‐mail:</label>

<input type="email" id="email" name="email" />

<label>URL:</label>

<input type="url" id="url" name="url" />

<label>Telephone</label>

<input type="tel" id="phone" name="phone" />

<label>Number Demo:</label>

<input type="number" name="MyNumberElement" id="MyNumberElement" />

<label>Range Demo:</label>

<input type="range" name="MyRangeElement" id="MyRangeElement" />

<label>Color Demo</label>

<input type="color" id="MyColorElement" name="MyColorElement" />

</td>

<td>

<label>Date Demo</label>

<input type="date" id="MyDateElement" name="MyDateElement" />

<label>Time Demo</label>

<input type="time" id="MyTimeElement" name="MyTimeElement" />

<label>DateTime Local Demo</label>

<input type="datetime‐local" id="datetime" name=" datetime" />

<label>Month Demo</label>

<input type="month" id="month" name="month" />

<label>Week Demo</label>

<input type="week" id="MyWeekElement" name="MyWeekElement" />

<div style="text‐align:right">

<input type="submit" value="validate" />

</div>

</td>

</tr>

</table>

</form>

Note: In the code you can see that we have introduced some new input types like email, url, tel etc. These typeswill only serves validation. As per rendering is concerned they will simply generates textbox.

Step 2 – Execute and test the application


7 of 18 3/28/2015 1:04 PM

As you can see values in the input controls are validated and a predefined error message is shown (in a popup)automatically in case of validation fail.

Note: In the image I have shown demo for only three input controls. You can download the source attached andcheck for other

Lab 6 – Implementing validation using custom validation attributes

In HTML 5 new attributes are added input controls to support validation. Let’s do a demo on some of them.

Step 1 – Create input controls as follows

<form>

<label>Email</label>

<input type="email" name="TxtEmail"

id="TxtEmail" required />

<label>User Name</label>

<input type="text" name="username"

id="username" pattern="[a‐zA‐Z]{5,}" />

<label>Age</label>

<input type="number" name="TxtAge"

id="TxtAge" min="10" max="50" />

<br /><input type="submit" value="Register" />

</form>

Explanation:

Required attributes makes textbox a compulsory fieldPattern attribute is set to a regular expression indicating that it should contain minimum 5 and maximum10 characterMin and Max attribute works with number input control and force control to contain values within thatrange.

Output:


8 of 18 3/28/2015 1:04 PM

Lab 7 – Customizing validation

We can customize HTML 5 validation completely by handling “oninvalid” event.

Step 1 – Create Input controls, attach validation attributes and add customized error messages as follows.

<form>

<label>Email</label>

<input type="email" name="TxtEmail"

id="TxtEmail" required/>

<span class="MissingEmailSpan invalid">Email Missing</span>

<span class="InvalidEmailSpan invalid">Invalid email</span>

<label>User Name</label>

<input type="text" name="username"

id="username" pattern="[a‐zA‐Z]{5,10}" />

<span class="InvalidUserNameSpan invalid">Username not matching with pattern</span>

<label>Age</label>

<input type="number" name="TxtAge"

id="TxtAge" min="10" max="50" />

<span class="AgeIsNotInRangeSpan invalid">Age must be be between 10 and 50</span>

<span class="InvalidAgeSpan invalid">Invalid Age</span>

<br /><input type="submit" value="Register" />

</form>

Step 2 – Add a style tag and create css to hide error messages initially

<style>

.invalid {

display: none;

}

</style>

Step 3 – Hide error message on submit click.

<input type="submit" value="Register" onclick="$('.invalid').hide();" />

Step 4 – Invoke functions when input controls contain invalid values.

<input type="email" name="TxtEmail" id="TxtEmail" oninvalid="OnInvalidEmail();" required/>

(Repeat above step for all input controls)

Step 5 – Create Event handler JavaScript function as follows.

function OnInvalidEmail()

{

event.preventDefault();

var element = event.srcElement;

var validity = element.validity;

if (validity.valueMissing) {

$('.MissingEmailSpan').show();

}

else if (validity.typeMismatch) {

$('.InvalidEmailSpan').show();

}

}

(Repeat above step for all input controls)

Explanation:


9 of 18 3/28/2015 1:04 PM

event.preventDefault(); - It will prevent the default behavior. Show error message as popup.event.srcElement - Control to which contain invalid value. In this case email textbox.element.validity – Contains the validation information about control. Important attributes are

valueMissing – will be true when “required” attribute is attached to control and current value isblank.typeMismatch – will be true when type mismatches with current value of control.badInput – will be true when value in the control is invalid. Example – It’s a number textbox andalphatic character is added.rangeOverflow and rangeUnderflow – will be true when control is number textbox and values arenot within the range

Step 5 – Execute and Test the application

You can download the attached source code for complete demonstration.

Lab 8, 9 and 10 and 11 - Application Cache in HTML5When someone says “Web application” then what comes to your mind first? Internet isn’t it?

You have internet ==> you are online ==> you can use the application

Your internet is down = > you are offline ==>you cannot use the application

Think about Outlook. It gives you an option to check your past mails even if you are offline. Just imagine iffacebook, gmail had such featuresJ. If our internet application were working even in offline mode it would havemade our life easy.

Now this is possible with HTML 5 application cache. Let’s understand it with sample demos.

Lab 8 – Simple Application Cache Demo

Step 1 – Create a new Asp.net Web Forms application

Open visual studio and create a new empty asp.net web forms application

Step 2 – Add Style.css

Right click the project. Add new folder and name it Styles Right click the styles folder >> Add >> New Item. Select style sheet and name it style.cssAdd following css block inside style.css

.DivStyle {

background‐color:silver;

}

Step 3 – Create manifest text file as follows

Right click the project. Add >> New Item. Select Text file and name it MyCache.txtAdd following content inside it

CACHE MANIFEST

# ver 1

CACHE:

/Styles/Style.css

Step 4 – Create a file which need to be cached

Right click your project. Add >> New Item. Select Web Form and name it MyPage.aspxAdd following content inside file

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="MyPage.aspx.cs" Inherits="MyPage" %>

<!DOCTYPE html>


10 of 18 3/28/2015 1:04 PM

<html manifest="MyCache.txt">

<head runat="server">

<title></title>

<link href="Styles/Style.css" rel="stylesheet" />

</head>

<body>

<form id="form1" runat="server">

<div class="DivStyle" id="MyDiv">

Hi, Execution count is 1

</div>

</form>

</body>

</html>

Step 5 – Execute the application

Step 6 – Go offline

Step 7 – Refresh the page

You will notice that you are still able to browse the application.

Step 8 – Change the Web Form

Open MyPage.aspx. And Change content inside “MyDiv” to something else.

<div class="DivStyle" id="MyDiv">


</div>

Step 9 – Execute the applications

It’s not a new output. It’s not refreshing.

Step 10 – Change the manifest file as follows

CACHE MANIFEST

# ver 3

CACHE:

/Styles/Style.css

Step 11 – Refresh the page twice

Now you will get the updated output.

Explanation: Understanding step by step

Very first line in the manifest line that is “CACHE MANIFEST” indicates that it’s a manifest file1. In the page “manifest” attribute of html indicates that “MyPage.aspx” need to be cached.2. In the manifest file there is a section “CACHE”. It will contain a list of files which are required for3.


11 of 18 3/28/2015 1:04 PM

MyPage.aspx to run properly in offline mode. All of these files will be cached along with MyPage.aspx.End user will get the latest contents during the first request and then they get cached. All the subsequentrequests will get cached version.

4.

Cache will get updated when something get changed inside manifest file hence in manifest file just after“CACHE MANIFEST” keyword one comment line is added. In this example we mentioned it as “ver 2” but itcan be anything.

5.

When end user makes a request if requesting contents are cached browser will return the cached versionof the content but in the same time in the background browser will make a request for manifest and see ifmanifest is changed in the server. In case it is changed Cache will be updated. But as I said it will be donein the background hence the current request will get the old content. Hence we have to make doublerefresh

6.

Lab 9 – Solve the double refresh problem

For this simply add following code in your page.

<script>

window.applicationCache.onupdateready = function (e) {

applicationCache.swapCache();

location.reload();

}

</script>

onupdateready event will be fired immediately after the cache is updated.

Note – While practice make sure to clear the Application cache manually before every lab. If you are a chromeuser you can do it in this way.

Click on gear icon and go to settings.Expand advanced settings.Click on content settingsClick on All Cookies and site data

In the search box enter localhost and click delete icon

Lab 10– Understand more about manifest

“CACHE” is not the only section in the manifest file. There are more.

NETWORK – If you are caching a page you have to specify all the resources in it. Means all the css files, jsfiles, images etc used in the page.In some cases we want that some resources will be available only online. When it comes to offline itshould not be available.

NETWORK section let us list those which we don’t want to cache.

FALLBACK – In some cases we want that some resources should be replaced with some other resources


12 of 18 3/28/2015 1:04 PM

when it goes offline. Example when it’s online everything should be “red” but when offline everythingshould be “green”.

Fallback let us define those settings.

Let’s have a demo and understand it.

Step 1 – Create a new Asp.net Web Forms application

Open visual studio and create a new empty asp.net web forms application

Step 2 – Create stylesheet Files

Right click the project. Add new folder and name it Styles Right click the styles folder >> Add >> New Item. Select style sheet and name it style.cssAdd following css block inside style.css

.Div1 {


}

Right click the styles folder >> Add >> New Item. Select style sheet and name it style2.cssAdd following css block inside style2.css

.Div3 {


}

Right click the project. Add new folder and name it OnlineStylesRight click the OnlineStyles folder >> Add >> New Item. Select style sheet and name it Style3.cssAdd following css block inside style.css

.Div3 {


}

Right click the project. Add new folder and name it OfflineStylesRight click the OfflineStyles folder >> Add >> New Item. Select style sheet and name it Style4.cssAdd following css block inside style.css

.Div3 {

background‐color:lightbue;

}

Step 3 – Create manifest text file as follows

Right click the project. Add >> New Item. Select Text file and name it MyCache.txtAdd following content inside it

CACHE MANIFEST

# ver 1

CACHE:

/Styles/Style.css

# Comment – Style.css will be cached with page

NETWORK:

/Styles/Style2.css

# Comment – Style2.css will be available only online

FALLBACK:

OnlineStyles\Style3.css OfflineStyles\Style4.css

# Comment – Style3.css will be used when online and style4.css will be cached and used when application is offline

Step 4 – Create a file which need to be cached

Right click your project. Add >> New Item. Select Web Form and name it MyPage.aspxAdd following content inside file

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="MyPage.aspx.cs" Inherits="MyPage" %>

<!DOCTYPE html>


13 of 18 3/28/2015 1:04 PM

<html manifest="MyCache.txt">

<head runat="server">

<title></title>

<link href="Styles/Style.css" rel="stylesheet" />

<link href="Styles/Style2.css" rel="stylesheet" />

<link href="OnlineStyles/Style3.css" rel="stylesheet" />

<script>

window.applicationCache.onupdateready = function (e) {

applicationCache.swapCache();

location.reload();

}

</script>

</head>

<body>

<form id="form1" runat="server">

<div class="Div1" id="MyDiv1">


</div>



</div>



</div>

</form>

</body>

</html>

Step 5 – Execute the application

Step 6 – Go offline


As you can style2.css didn’t cached and style3.css is replaced with style4.css

Lab 11 - Importance of NETWORK section

One may ask a question what will happen if you won’t provide it.

In the above example let say we won’t specify Network section. Let’s understand it by a demo,

Step 1 – Clear the cache

Follow the step described in a note after Lab 8.


14 of 18 3/28/2015 1:04 PM

Step 2 – Remove NETWORK Section and execute the application

When your application executes for the first time it works fine and you will get a correct output.


Now don’t stop your application. Simply refresh the page you will see some strange output like this.

You are online but still style2.css formatting is not applying because only application get cached it will alwaysloaded from the cache.

When you specify Style2.css in NETWORK section it will always load that file from online location. If you areonline it will work, if you are offline they won’t get loaded.

Application caching vs old browser caching

Browser caching works on File level. Browser automatically caches individual files which ultimately reduces thesubsequent request load. It will not make your application work offline because some files required for executionof application may not be exist in the cache.

Application caching works on application level. It works on transaction. Here one application means, Page whichcontain manifest attribute + all the resources specified in CACHE and FALLBACK section of manifest file. Either allof them get cached or none. If one of the resource fail to cache, application cache won’t work.

SummarySo that’s it for Day 1.

Hope you enjoyed reading it.

Don’t forget to vote and comment.

For all kind of online, Video based, corporate trainings on various Microsoft and Non-Microsoft technologies likeMVC, WCF, Design patterns, MSBI, Angular, HTML 5 etc. visit www.JustCompile.com

For reasonable class room trainings visit http://stepbystepschools.net/.

For 500+ videos on MSBI, .NET, SharePoint, Architecture, SQL, WPF, WCF, MVC, ASP.NET etc click@ www.questpond.com

Day 2 and Day 3 Agenda

WebSocketsCanvasSVGMediaDrag and dropGeoLocationWebStorageWeb WorkerServer Sent eventsWeb SqlIndexDB

References

http://www.codeproject.com/Articles/702051/important-HTML-Interview-questions-with-answe

LicenseThis article, along with any associated source code and files, is licensed under The Code Project Open License(CPOL)


15 of 18 3/28/2015 1:04 PM

Marla SukeshTechnical Lead ShawMan SoftwaresIndia

Learning is fun but teaching is awesome. Code re-usability is my passion ,Teaching and learning is my hobby, Becoming an successful entrepreneur is mygoal. By professional I am a Corporate Trainer.I do trainings on WCF, MVC, Business Intelligence, Design Patterns, HTML 5, jQuery, JSON and many moreMicrosoft and non-Micrsoft technologiees.

Find my profile here

My sites

justcompile.comwww.sukesh-marla.com

@Twitter@Facebook

Follow on Twitter Google LinkedIn

Add a Comment or Question Search Comments Go

Share

About the Author

Comments and Discussions

Profile popups Spacing Relaxed Noise Medium Layout Normal Per page 50 Update

First Prev Next

sandeepkumarvemula 24-Mar-15 3:38

Marla Sukesh 24-Mar-15 5:47

Sangunni 28-Jan-15 9:48

M Rayhan 5-Dec-14 4:19

Marla Sukesh 6-Dec-14 12:43

abhishekdec1 4-Dec-14 8:18


StanleyJHubert 4-Dec-14 5:09


Member 11067341 3-Dec-14 9:06

EMAIL

Nice information

Re: Nice information

I am pretty new to HTML5, however this article helped me tounderstand the concept

My vote of 5

Re: My vote of 5

Where I can get DAY 2 and Day 3?

Re: Where I can get DAY 2 and Day 3?

My vote of 5

Re: My vote of 5

Quality article...we need more true HTML5 tutorials


16 of 18 3/28/2015 1:04 PM


aarif moh shaikh 4-Dec-14 2:50

Member 11067341 4-Dec-14 8:51

Member 10375744 17-Nov-14 3:45


VaibhavKamble 17-Nov-14 2:19


Member 8773468 16-Nov-14 11:38


SOSPC 11-Nov-14 8:35


BaharDev 11-Nov-14 3:22


Mahsa Hassankashi 9-Nov-14 8:05


Malay Kumar Pandey 2-Nov-14 14:33


AvneeshKaushik 28-Oct-14 21:35


Member 3483641 28-Oct-14 3:31


Gun Gun Febrianza 24-Oct-14 5:16

Marla Sukesh 24-Oct-14 6:47

Member 11171047 23-Oct-14 2:23


JCahyaatnttearjee 20-Oct-14 23:59


Martin Berger 18-Oct-14 21:14


Member 8651121 18-Oct-14 12:49


Member 10419815 17-Oct-14 14:09


Member 10419815 17-Oct-14 14:19


Member 9666728 17-Oct-14 17:06

Heriberto Lugo 18-Oct-14 20:24

chuckles_net 17-Oct-14 13:42


chuckles_net 17-Oct-14 17:51

Re: Quality article...we need more true HTML5 tutorials



excellent

Re: excellent

My vote of 5

Re: My vote of 5

How can I validate the input that uses the datalist?

Re: How can I validate the input that uses the datalist?

Good job, Thanks!

Re: Good job, Thanks!

Good job

Re: Good job

My vote of 5

Re: My vote of 5

Good Work!!

Re: Good Work!!

Where is day 2 and day 3

Re: Where is day 2 and day 3

Very nice!

Re: Very nice!

My vote of 5

Re: My vote of 5

about html5

Re: about html5

My vote of 5

Re: My vote of 5

Thanks!

Re: Thanks!

About day 2

Re: About day 2

My vote of 3

Re: My vote of 3

Re: My vote of 3

Re: My vote of 3

Re: My vote of 3

Re: My vote of 3

I'd give it a 4, also

Re: I'd give it a 4, also

Re: I'd give it a 4, also


17 of 18 3/28/2015 1:04 PM

Permalink | Advertise | Privacy | Terms of Use | MobileWeb04 | 2.8.150327.1 | Last Updated 24 Mar 2015

Article Copyright 2014 by Marla SukeshEverything else Copyright © CodeProject, 1999-2015

Layout: fixed | fluid

Last Visit: 1-Jan-00 0:00 Last Update: 27-Mar-15 22:34 Refresh 1 2 Next »

General News Suggestion Question Bug Answer Joke Rant Admin

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.


18 of 18 3/28/2015 1:04 PM

learn html 5 in 3 days – day 1 - codeproject

Documents