画布默认大小答案

【问题标题】：canvas default size画布默认大小
【发布时间】：2011-12-09 05:13:47
【问题描述】：

Chrome 似乎将画布标签的默认宽度设置为 300 像素。

当我希望画布默认为其包含 div 的大小时，这有点麻烦。

使用示例here，我希望画布默认为标题的宽度并添加填充。

希望这是有道理的。

如果没有 javascript，这可能吗？

【问题讨论】：

【解决方案1】：

安排您的布局，以便有一个 div，而该 div 的唯一工作是规定和成为您希望画布的大小。

var canvas = document.createElement('canvas');
canvas.width = div.clientWidth;
canvas.height = div.clientHeight;

然后将画布添加到 div 中。

【讨论】：

这是显而易见的答案，但是我的问题是画布标签已在服务器端生成 - 它不是在客户端创建的。这是不好的做法吗？
只要您能够使用相同的技术，设置画布的宽度和高度应该不会有任何问题。 Mozilla Bespin 过去经常检查 div 是否改变了大小，然后相应地（重新）设置画布。
我想如果用户禁用了 javascript，我想确保布局看起来不错。完全避免使用 javascript 来设置初始布局的样式。看起来这是不可能的，这似乎是 canvas 标签的严重限制。同样，我可能做错了什么/使用了不良做法。
如果 JavaScript 无论如何都被禁用，Canvas 基本上毫无价值。 ://
好吧，如果必须的话，在服务器端创建它们（无论如何你正在这样做），宽度和高度为 1。如果他们碰巧启用了javascript，则对其进行调整。

【解决方案2】：

芬恩，你是对的。

canvas元素有两个属性来控制坐标空间的大小：宽度和高度。

这些属性在指定时必须具有有效的非负整数值。

width属性默认为300，height属性默认为150。

【讨论】：

【解决方案3】：

我可以确认，在 Chrome 中，默认大小是 300px x 150px。

【讨论】：