Capítulo 4

Canvas - Exemplo 25: Textos e fontes.

Conteúdo alternativo para navegadores que não suportam canvas.

JavaScript

<script>
var canvas = document.getElementById('quadro');
var ctx = canvas.getContext('2d'); 

	ctx.font = 'italic small-caps bold  40px Georgia, sans-serif' ;
	ctx.fillStyle = '#0f0';
	ctx.strokeStyle = '#009';
	ctx.fillText('Livro html5', 20, 50)
	ctx.strokeText('Livro html5', 20, 50)
	
	ctx.font = '100px Arial, serif';
	ctx.lineWidth = 2;
	ctx.strokeStyle = '#c30';
	ctx.strokeText('Livro html5 do Maujor', 60, 160, 200)
</script>

CSS

	canvas {border:1px solid #ccc;}

HTML

	<canvas id="quadro" width="400" height="200">
		<p>Conteúdo alternativo para navegadores que não suportam canvas.</p>
	</canvas>