需要像 textarea 一样调整 Canvas div 的大小？答案

【问题标题】：Need to resize the Canvas div like textarea?需要像 textarea 一样调整 Canvas div 的大小？
【发布时间】：2017-12-02 15:43:19
【问题描述】：

需要调整（可拖动）画布 div 的大小。 ()

我试过下面的代码：

<canvas class="canvas"></canvas>

.canvas
{

border: 1px solid;

resize: both;

overflow: auto;

}

同样的代码适用于 div 元素，但对于 canvas 元素它不起作用。

是否可以像 textarea 一样调整画布元素的大小？

【问题讨论】：

标签： jquery html css canvas html5-canvas

【解决方案1】：

Canvas 似乎无法通过这种方式调整大小。

但是你可以把它放在一个div中：

div
{

  border: red 1px solid;
  overflow: hidden;
  resize: both;

  height: 100px; 
  width:200px; margin:10px;padding:10px;
  
}

canvas{

  width:100%;
  height:100%;
  border: green 1px solid;
  
}

<div>
  <canvas class="canvas"></canvas>
</div>

【讨论】：

【解决方案2】：

div {
  border: red 1px solid;
  overflow: hidden;
  resize: both;
  height: 100px; 
  width:200px;
  margin:10px;
  padding:10px;
}

canvas {
  width:100%;
  height:100%;
  border: green 1px solid;
}

<div>
  <canvas class="canvas"></canvas>
</div>

【讨论】：