Essential Books

Hello World

suggest change

HTML 

<canvas id="canvas" width=300 height=100 style="background-color:#808080;">
</canvas>

Javascript 

var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");
ctx.font = "34px serif";
ctx.textAlign = "center";
ctx.textBaseline="middle"; 
ctx.fillStyle = "#FFF";
ctx.fillText("Hello World",150,50);

Result

Found a mistake? Have a question or improvement idea? Let me know.

Feedback about page:

Feedback:
Optional: your email if you want me to get back to you:

Getting started:
* Getting started with html5-canvas
* Creating a responsive full page canvas
* Detecting mouse position on the canvas
* Canvas size and resolution
* How to add the Html5 Canvas Element to a webpage
* Simple animation with 2D context and requestAnimationFrame
* Drawing many translated scaled and rotated images quickly
* Image cropping using canvas
* The Tained canvas
* Off screen canvas
* Hello World
* An index to Html5 Canvas Capabilities Uses
* Rotate
* Save canvas to image file
Table Of Contents