HTML5高级程序设计,遇到了canvas显示问题。
canvas默认画布大小:300*150
用CSS设置画布大小遇到问题
我们通常想到用CSS设置画布大小,但执行结果却很奇怪
这是因为,使用CSS设置画布大小会导致画布按比例缩放你设置的值。(css只是设置canvas在屏幕的显示大小)
举例:
用css设置
width: 450
height: 300
与默认画布大小300150对比,比例分别为1.5和2.
所以当我们设置画布里的线条宽高为100100时,
真实显示的宽:1001.5=150.显示的高:1002=200;
那么如何正确改变canvas的默认大小
1.行内样式
2.JS改变
设置画布大小后样式会重置
本篇文章转载至:
https://blog.csdn.net/csm0912/article/details/52963240