将具有CSS或JS的Canvas缩放到屏幕的最佳方法是什么？以及如何使画布的宽度等于高度？

Question

我想制作一个TIC TAC TOE，并且对js来说还很新。我想在画布上绘制x和0。1.如何使高度等于画布的宽度？2.缩放画布以在电话上使用并具有相同体验的最佳方法是什么？

Answer 1

您可以制作全屏画布，并使用它来显示代码。这是一个入门指南：HTML

<canvas id="canvas"></canvas>

CSS

* {
  margin: 0;
}

canvas {
  display: block;
}

[JS

window.onload = function() {
  var canvas = document.getElementById("canvas"),
      context = canvas.getContext("2d"),
      width = canvas.width = window.innerWidth,
      height = canvas.height = window.innerHeight;

  context.fillRect(0, 0, width, height);
};