您现在的位置:首页 >> 前端 >> 内容

canvas画布使用fillRect()时高度会放大的问题及解决方案

时间:2017/10/28 10:16:50 点击:

  核心提示:当设置canvas的宽度和高度时,习惯性会不会使用内联样式。但对于canvas来说,fillRect(),只有在内联样式的时候才有效,外部的CSS往往会发生拉伸的情况。这是网上找来的答案:(1)在代码...

当设置canvas的宽度和高度时,习惯性会不会使用内联样式。但对于canvas来说,fillRect(),只有在内联样式的时候才有效,外部的CSS往往会发生拉伸的情况。

这是网上找来的答案:

(1)在代码js中添加设置宽高属性的代码设置宽度和高度:

canvas.setAttribute("height",canvas.clientHeight);  
canvas.setAttribute("width",canvas.clientWidth);  

(2)除去外部css中设置宽高属性的代码,给canvas标签直接添加宽度和高度属性:

<canvas id="canvas" width="300" height="400" style="background:#fff;">  
    <span>不支持canvas标签</span>  
</canvas>  

Tags:CA AN NV VA 
作者:网络 来源:layuecr的博客