<分区>
我有一个像这样的 html:
.image-detail {
height: 100%;
width: 100%;
display: block;
position: relative;
}
canvas {
display: block;
}
.image-detail-canvas {
-moz-user-select: none;
-webkit-user-select: none;
max-width: 100% !important;
max-height: 100% !important;
position: absolute !important;
left: 50% !important;
top: 50% !important;
transform: translate(-50%, -50%) !important;
}
<div class="image-detail">
<canvas class="image-detail-canvas" id="image-canvas">
</canvas>
</div>
它使 Canvas 居中,但 Canvas 正在拉伸(stretch)。
我不希望 Canvas 被拉伸(stretch)。
我希望它居中而不拉伸(stretch)。如果 Canvas 是水平的,则水平居中,如果是垂直的,则依此类推。