我在缩小canvas属于grid容器的元素时遇到问题。html * { font-size: 1em; font-family: Arial;}#wrapper { border: 1px solid green; display: grid; grid-template-columns: repeat(auto-fit, 32vmin); grid-auto-rows: minmax(32vmin, 43vmin); grid-column-gap: 0.4em; grid-row-gap: 0.4em; align-items: center; justify-items: center;}#wrapper > * { object-fit: contain; max-height: 32vmin; max-width: 32vmin; border: 1px solid black;}#canvas0 { width:20vmin; height:60vmin;}<html><body> <div id="wrapper"> <canvas id="canvas0"></canvas> </div></body></html>上面的代码显示canvas已width: 20和height: 60与的结果纵横比缩放1:2。我需要的是一个canvas适合最大grid行高和列宽的元素,并且保持其纵横比不变。
添加回答
举报
0/150
提交
取消