<html>
<h1> Criando o personagem creeper do Minecraft </h1>
Para facilitar um pouco mais, segue o tamanho (largura, altura) em pixels de cada retângulo:
<p>
Retângulo 1: 350, 300 (cabeça).<br>
Retângulos 2 e 3: 90, 90 (olhos).<br>
Retângulo 4: 70, 100 (nariz).<br>
Retângulos 5 e 6: 40, 110 (parte da boca).<br>
<br>
Criar um novo arquivo, por exemplo creeper.html.
Definir a tag canvas.
<br> <br>
Criar um script com tela e pincel.
<br><br>
Desenhar os retângulos através da função fillRect do pincel.
Não esquecer de pintar os retângulos, aqui usamos as cores darkgreen e black.
<br>
</p>
<canvas width="600" height="400"> </canvas>
<script>
var tela = document.querySelector('canvas');
var pincel = tela.getContext('2d');
pincel.fillStyle = 'lightgrey';
pincel.fillRect(0,0,600,400);
pincel.fillStyle = "darkgreen";
pincel.fillRect (130,50,350,300);
pincel.fillStyle = "#000000";
pincel.fillRect (178,100,90,90)
pincel.fillStyle = "#000000";
pincel.fillRect (341,100,90,90)
pincel.fillStyle = "#000000";
pincel.fillRect (270,190,70,100)
pincel.fillStyle = "#000000";
pincel.fillRect (230,240,40,110)
pincel.fillStyle = "#000000";
pincel.fillRect (340,240,40,110)
</script>
</html>