问题描述，canvas画图的js代码中编写的是画正方形的代码，结果在360浏览器上变成了长方形，不知道怎么回事，请问各位大神是否遇到过此类问题？
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<style>
#canvas{
width:200px;
height:400px;
}
</style>
</head>
<body> <canvas id="canvas">
浏览器不支持HTML5 Canvas
</canvas>
</body>
</html>
<script type="text/javascript">
var ctx = document.getElementById("canvas").getContext('2d');
ctx.fillStyle = "#000000"; ctx.strokeStyle = "#ff00ff"; ctx.lineWidth = 2; ctx.fillRect(10, 10, 40, 40); ctx.strokeRect(0, 0, 60, 60); ctx.clearRect(20, 20, 20, 20);
</script>
按理说，效果应该显示为图一
结果却显示成了图二
这种情况确实是浏览器的问题吗？