Tuesday, 22 January 2013

What is Canvas?


The HTML5 <canvas> is the element, which is used to draw graphics, via scripting (generally JavaScript).
The <canvas> element is just a container for graphics. You must use a script in order to draw the graphics.
There are various methods of  Canvas for drawing paths, circles, boxes, characters and adding images.


EG:-

<!DOCTYPE html>
<html>
<body>

<canvas id="myCanvas" width="1000" height="500" style="border:1px solid #cccccc;">

</canvas>

</body>
</html>





HTML5 Document

<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
</head>

<body>
 Document content
</body>

</html>

The HTML5

<!DOCTYPE html>

HTML5 uses CSS3



  1. New Selectors
  2. New Properties
  3. Animations
  4. 2D/3D Transformations
  5. Rounded Corners
  6. Shadow Effects
  7. Downloadable Fonts

Monday, 21 January 2013

New Semantic/Structural Elements

<article> Defines an article
<aside> Defines content aside from the page content
<bdi> Isolates a part of text that might be formatted in a different direction from other text outside it
<command> Defines a command button that a user can invoke
<details> Defines additional details that the user can view or hide
<summary> Defines a visible heading for a <details> element
<figure> Specifies self-contained content, like illustrations, diagrams, photos, code listings, etc.
<figcaption> Defines a caption for a <figure> element
<footer> Defines a footer for a document or section
<header> Defines a header for a document or section
<hgroup> Groups a set of <h1> to <h6> elements when a heading has multiple levels
<mark> Defines marked/highlighted text
<meter> Defines a scalar measurement within a known range (a gauge)
<nav> Defines navigation links
<progress> Represents the progress of a task
<ruby> Defines a ruby annotation (for East Asian typography)
<rt> Defines an explanation/pronunciation of characters (for East Asian typography)
<rp> Defines what to show in browsers that do not support ruby annotations
<section> Defines a section in a document
<time> Defines a date/time
<wbr> Defines a possible line-break

Browser Support for HTML5


  1. Firefox
  2. Opera
  3. Chrome
  4. Safari 
  5. and Internet Explorer 9



HTML5 - New Features

Most important new features in HTML5:

  • The <video> and <audio> elements for media playback
  • The <canvas> element for 2D drawing
  • New content-specific elements, like <article>, <footer>, <header>, <nav>, <section>
  • Support for local storage
  • New form controls, like calendar, date, time, email, url, search

What is HTML5?

HTML5 will be the new standard for HTML.
  1. Full CSS3 Support
  2. 2D/3D Graphics
  3. Video and Audio
  4. Local Storage
  5. Local SQL Database
  6. Web Applications
  7. New Elements
  8. New Attributes