Latest web development tutorials

HTML5 Tutorials

HTML

HTML5 is the latest HTML revision in October 2014 by the World Wide Web Consortium (W3C) standards completed.

HTML5 is designed to support multimedia on mobile devices.

HTML5 easy to learn.

What is HTML5?

HTML5 is the next generation of HTML standard.

HTML, the previous version of HTML 4.01 was born in 1999. Since then, Web world has undergone a sea change.

HTML5 is still in its perfected. However, most modern browsers already have some HTML5 support.

HTML5 is how to start?

W3C and WHATWG HTML5 is the result of cooperation, WHATWG means Web Hypertext Application Technology Working Group. .

WHATWG dedicated web forms and applications, and W3C focused on XHTML 2.0. In 2006, the two sides decided to cooperate to create a new version of HTML.

HTML5 some interesting new features:

  • For painting canvas element
  • video and audio elements for media playback
  • Better support for local offline storage
  • New special content elements, such as article, footer, header, nav, section
  • New form controls, like calendar, date, time, email, url, search

HTML5 <! DOCTYPE>

<! Doctype> declaration must be in the first line of the document HTML5, very simple to use:

<! DOCTYPE html>

Minimal HTML5 document

Here is a simple HTML5 document:

<! DOCTYPE html> <Html> <Head> <Meta charset = "utf-8"> <Title> Document Title </ title> </ Head> <Body> content of the document ...... </ body> </ Html>

Note: For Chinese web pages need to use <meta charset = "utf-8 "> statement, otherwise it will be garbled.

Improved HTML5

  • new element
  • New property
  • Full support for CSS3
  • Video and Audio
  • 2D / 3D drawing
  • Local store
  • Local SQL data
  • Web Applications

HTML5 Multimedia

You can simply use HTML5 video playback (video) and audio (audio) in the page.

HTML5 Application

You can simply use HTML5 application development

  • Local data storage
  • Access to local files
  • Local SQL data
  • Cache quote
  • Javascript workers
  • XHTMLHttpRequest 2

HTML5 graphics

Use HTML5 you can simply draw graphics:

Use HTML5 CSS3

  • New selector
  • New property
  • Animation
  • 2D / 3D conversion
  • Fillet
  • Shadow effect
  • Downloadable fonts

Learn more CSS3 information please see the site of CSS3 tutorials.

Semantic elements

HTML5 adds a lot of semantic elements are as follows:

label description
<Article> Define separate page content area.
<Aside> Define sidebar content pages.
<Bdi> It allows you to set a piece of text, text direction away from the parent element settings.
<Command> Custom Command buttons - such as radio buttons, check boxes or buttons
<Details> Details of the document or a section for
<Dialog> Customize dialog box, such as balloons
<Summary> The title tag contains details of elements
<Figure> Separate provisions streaming content (images, graphics, photographs, code, etc.).
<Figcaption> Definition of <figure> element title
<Footer> Defined section or document footer.
<Header> It defines the head area of ​​the document
<Mark> Defined text with the mark.
<Meter> Definition of weights and measures. Known only used to measure the maximum and minimum values.
<Nav> Define navigation links section.
<Progress> Defined schedule any type of task.
<Ruby> Definition of ruby ​​annotation (Chinese phonetic or characters).
<Rt> Defined characters (Chinese phonetic or character) interpretation or pronunciation.
<Rp> In ruby ​​annotation is used to define the content does not support the ruby ​​element browser displayed.
<Section> The definition of the document section (section, section).
<Time> Define the date or time.
<Wbr> Provisions in the text where appropriate to add a line break.

HTML5 Forms

New form elements, new attributes, new input types, automatic verification.

Removed elements

The following HTML 4.01 elements in HTML5 has been deleted:

  • <Acronym>
  • <Applet>
  • <Basefont>
  • <Big>
  • <Center>
  • <Dir>
  • <Font>
  • <Frame>
  • <Frameset>
  • <Noframes>
  • <Strike>

Examples of each chapter

Through our HTML editor, you can edit the HTML, then click the button to see the results.

Examples

<! DOCTYPE HTML> <Html> <Head> <Meta charset = "utf-8"> <Title> This tutorial (w3big.com) </ title> </ Head> <Body> <Video width = "320" height = "240" controls> <Source src = "movie.mp4" type = "video / mp4"> <Source src = "movie.ogg" type = "video / ogg"> Your browser does not support the video tag. </ Video> </ Body> </ Html>

try it"

Click the "Try" button to view the results online operation.

HTML5 Browser Support

The latest version of Safari, Chrome, Firefox and Opera support some HTML5 features. Internet Explorer 9 will support some HTML5 features.

IE9 browser compatible versions of the following methods of HTML5, html5shiv package use the site to static resources:

<-! [If lt IE9] > <script src = "http://cdn.static.w3big.com/libs/html5shiv/3.7/html5shiv.min.js"> </ script> <[endif]! - ->

After loading, the initialization of the new label CSS:

/ * Html5 * / article, aside, dialog, footer, header, section, footer, nav, figure, menu {display: block }

HTML5 Reference Manual

In this site you can find the HTML5 tags and attributes described in detail please click HTML5 Reference Manual .