<canvas width="600", height="400"></canvas>
<script>
var tela = document.querySelector('canvas');
var pincel = tela.getContext("2d");
pincel.fillStyle = 'darkgreen';
pincel.fillRect(0,0 ,350,300);
pincel.fillStyle = 'black';
pincel.beginPath();
pincel.fillRect(50,60,90,90);
pincel.fillRect(210,60,90,90);
pincel.fillRect(140,150,70,100);
pincel.fillRect(100,170,40,110);
pincel.fillRect(210,170,40,110);
</script>
Oi, Fernanda! Tudo bem?
Excelente resolução, mandou muito bem!
Continue praticando. =)
Qualquer dúvida, estamos à disposição!
Abraços e bons estudos!
Boa Fernanda. Fico feliz que tenha terminado a tarefa. :D
Mas se me permite dar uma dica: Nesse caso, não era necessario utilizar o beginPath, pois ao criar retangulos, vc pode dar a cordenada X,Y onde ele deve ser criado fillRect( cordenada X, cordenada Y, largura, altura);
Nesse caso não interfere em nada o beginPath, mas é sempre uma boa evitar criar linhas de códigos desnecessarias pois em um futuro próximo quando os códigos estiverem maiores, isso pode ajudar a "pesar" o programa :D
Segue meu código:
<canvas width="600" height="400"></canvas>
<script>
var tela = document.querySelector("canvas");
var pincel = tela.getContext("2d");
pincel.fillStyle = "darkgreen";
pincel.fillRect(0,0,350,300);
pincel.fillStyle = "black"
pincel.fillRect(50,50,90,90);
pincel.fillRect(210,50,90,90);
pincel.fillRect(140,140,70,100);
pincel.fillRect(100,190,40,110);
pincel.fillRect(210,190,40,110);
</script>