HTML <canvas> Tag
Description
The <canvas> HTML element creates an area in which using JavaScript you can draw different objects, display images, transform them and change properties. Using <canvas> you can create drawings, animations, games, etc.
Properties
- Permitted Parents
- Any element that accepts phrasing content
- Content
- Inline and text
- Start/End Tags
- Start tag: required, End tag: required
Example
<canvas id="canvasTest">Your browser does not support the HTML5 canvas tag.</canvas>
<script type="text/javascript">
var canvas=document.getElementById('canvasTest');
var ctx=canvas.getContext('2d');
ctx.fillStyle='#800000';
ctx.fillRect(0,0,100,100);
</script>Attributes
| Attribute | Definition |
|---|---|
| height | Specifies the canvas height in pixels |
| width | Specifies the canvas width in pixels |
Global Attributes
The <canvas> tag also supports the Global Attributes in HTML5
Event Attributes
The <canvas> tag also supports the Event Attributes in HTML5
Browser Support
| Desktop | |||||
 |
 |
 |
 |
 |
 |
| 9 | 12 | 1 | 1.5 | 9 | 2 |
| Tablets / Mobile | |||||
 |
|
|
|
|
 |
| 37 | 18 | 4 | 10.1 | 1 | 1.0 |
Last updated by CSSPortal on: 6th December 2019
Share this Page
If you have enjoyed using CSSPortal, please consider sharing this page with other users, just click on your preferred social media link or copy the webpage from the link below.
URL