画布的 HTML 属性（宽度、高度）独立变化答案

【问题标题】：HTML attributes (width, height) of canvas change independently画布的 HTML 属性（宽度、高度）独立变化
【发布时间】：2017-03-13 05:22:22
【问题描述】：

我在 JS 上有一些脚本，它改变了画布元素的宽度和高度：

 function RefreshSizes (canvas) {
        var temp_width = 320;
        var temp_height = 240;

        document.getElementById(canvas).setAttribute('width', temp_width);
        document.getElementById(canvas).setAttribute('height', temp_height);
    }

此函数在画布初始化后立即调用。它在 Chrome 上运行良好。

但在 FireFox 49 中我看到：

会是什么？

UPD#1 BukkitmanPlays MCPE 的测试代码

UPD#2 画布的完整 CSS：

    element {
        width: 320px;
        height: 240px;
    }
    .canvas {
        border: 3px solid #E0E0E0;
        z-index: 0;
        position: relative;
    }
    html {
        font: 10px/10px arial;
    }

【问题讨论】：

顺便说一句，它不依赖于在 HTML 中初始化：
请考虑提供一个stackoverflow.com/help/mcve 来证明您的问题。
您没有向RefreshSizes() 传递任何参数。什么都不会发生。
对不起萨尔曼，但我认为你现在不是，第一个例子需要参数，但第二个例子不需要

标签： javascript html css firefox canvas

【解决方案1】：

一个浏览器上的一些代码在另一个浏览器上是不一样的，所以在这种情况下，我会做什么：

function RefreshSizes (canv) {
    var temp_width = 320;
    var temp_height = 240;

    var canvas = canv;
    canvas.width = temp_width;
    canvas.height = temp_height;
}

我相信这会奏效

【讨论】：