HTML5 Game - Fill Screen With Some Text

  1. HOME
  2. HTML5 Game
  3. Canvas
  4. Text Drawing

Description

Fill Screen With Some Text

Demo

ResultView the demo in separate window 

<!doctype html>
<html lang="en">
<body>
<div style="position: absolute; top: 50px; left: 50px;">
<canvas id="canvas" width="200" height="200">
 Your browser does not support the HTML 5 Canvas. 
</canvas>/* w ww.  ja  v  a 2  s .co  m*/
<script type="text/javascript">
  let theCanvas = document.getElementById('canvas');
    let context = theCanvas.getContext('2d');
   
    context.fillStyle = '#aaaaaa';
      context.fillRect(0, 0, 200, 200);
    context.fillStyle    = '#000000';
    context.font         = '20px sans-serif';
    context.textBaseline = 'top';
    context.fillText  ("Canvas!", 0, 0);
</script> 

</div>
</body>
</html>

Related Topic