2

我不知道为什么，但我的 JS 不会返回画布尺寸的正确值。

我有这个来获取值：

temp = document.getElementById('myCanvas');
canvas = new Array();
canvas['width'] = temp.width;
canvas['height'] = temp.height;

我的 CSS 和 HTML 是：

//html
<canvas id="myCanvas" class="c"></canvas>

//related css
.c{
    width:100%;
    margin:0 auto;
    height:500px;
    background-color:green;
    position:absolute; 
    left: 0; 
    top: 0;
    border:1px solid red;
}

数组结果显示：

width: 300, height: 150

如果 CSS 将其设置为 500px 并且在屏幕上显示为 500px，则这是不正确的。为什么会这样？

4

1 回答 1

1

这是正确的尺寸！

通过在 CSS 中设置画布尺寸，您没有更改画布的逐像素大小。它仍然是默认的 300x150，您只是拉伸了像素。如果你在拉伸的画布上画一个圆圈，你可以验证这一点：你会得到一个椭圆。最好直接改变canvas标签的width和height属性，不要在CSS中。

来源,例子

于 2012-11-20T02:14:33.950 回答