html - 固定图像尺寸

Question

我有一个可以由用户更改的图像。他可以上传要在页面上显示的任何图像。

我想设置一个固定的矩形，无论用户上传 16x16 图像还是 2048x2048 图像，它的大小都不会改变。

因此，上传的图像将调整大小以适合固定的矩形(小于矩形的图像将拉伸(stretch)以适合，大于矩形的图像将缩小以适合)。

HTML

<div class="float-left">

    <img width="300" height="300" src="@ViewBag.imgPath" alt="Your pic" />

</div>

我试图设置 img 元素的 width 和 height 属性，但它不起作用。我也尝试设置包含它的 div 的宽度和高度，但没有成功。

Answer 1

Html 样式不使用 px。此外，您应该在 css 中执行此操作，而不是内联硬编码或内联样式。

<div class="float-left">

    <img width="300" height="300" src="@ViewBag.imgPath" alt="Your pic" />

    <div class="centered bold">
        @Session["userName"]
    </div>

</div>