Não consegui desenhar o canvas

Fica em branco? Aperte F5 e me da um feedback para ver se funciona.

Sim Flávio, fica em branco. Já tentei F5, control + R, recriei o arquivo, usei aspas duplas, tentei no IE, Edge, e nada... alguma ideia?

Você escreveu errado a cor. O correto é lightgray. Por isso nada é exibido.

Agora é continuar com os estudos, Luiz!

Já tentei outras cores também...

<canvas width="600" height="400"> </canvas>

<script>

    var tela = document.querySelector('canvas');
    var pincel = tela.getContext('2d');

    pincel.fillStyle = 'red';
    pincel.fillRect = (0, 0, 600, 400);

    </script>

No console do seu Chrome, o que é exibido?

Você salvou o arquivo com a extensão correta? Se usou bloco de notas com certeza não esta.

Já tentei o console também, tudo em branco...

Estou usando o sublime, também já tentei excluir o arquivo e salva-lo novamente com o nome "canvas.html"...

Não funcionou porque você colou sem querer acento:

    pincel.fillRect = (0, 0, 600, 400);

O correto também é pincel.fillReact(0, 0, 600, 400);

Com um olhar de cangaceiro, reparei. Apague a linha e escreva novamente.

Sem querer, não faço ideia como , você colou um "i" que não é i.

Como disse, apaga e escreva fillRect novamente.

Aliás, para garantir, crie um arquivo novo e escreva tudo do zero. Para que o arquivo não tenha esse caractere inválido e você acabe cortando e colocando com problema.

Outro problema era que você usou fillRect como propriedade e não função.

Você fez assim:

  pincel.fillRect = (0, 0, 600, 400);

O correto é: pincel.fillRect(0, 0, 600, 400);

Na verdade, o caractere especial nem foi o vilão, foi mesmo a chamada da função.

Rescrevi tudo e continua tudo em branco...

<canvas width="600" height="400"></canvas>

<script>

    var tela = document.querySelector("canvas");
    var pincel = tela.getContext("2d");

    pincel.fillStyle = "red";
    pincel.fillRect = (0, 0, 600, 400);

</script>

Agora consegui, era a questão da propriedade mesmo...