[英]Different image sizes in a fixed sized container
I am re-sizing an image after a user uploads it to maintain its aspect ratio but be no more than 200 pixels wide or 200 pixels high. 我在用户上传图像以保持其纵横比但不超过200像素宽或200像素高后重新调整图像大小。
I am then displaying the image in an ASP.Net Image
control. 然后,我在ASP.Net
Image
控件中显示图像。 How do I prevent the images from affecting the surrounding elements? 如何防止图像影响周围的元素? I tried setting the
Width
property and Height
property of the control but that just re-sizes the image itself. 我尝试设置控件的
Width
属性和Height
属性,但这只是调整图像本身的大小。 Is there maybe a way to wrap the control in a div
with a fixed width/height? 有没有办法将控件包装在具有固定宽度/高度的
div
?
Thanks a lot 非常感谢
One way is to resize the image based on aspect ratio, but leave a border in order to fill the 200x200 size. 一种方法是根据宽高比调整图像大小,但留一个边框以填充200x200尺寸。 This can then be embedded in the page with the same dimensions without affecting layout.
然后可以将其以相同的尺寸嵌入页面中,而不会影响布局。
Alternatively you can just set the overflow
property of your surrounding div
to hidden, and set the div
Width/Height
. 另外,您可以将周围
div
的overflow
属性设置为hidden,然后将div
设置为Width/Height
。 However it depends how to want this to look. 但是,这取决于如何看待它。 Something like:
就像是:
<div style="overflow: hidden; width: 200px; height: 200px">
...
</div>
If you are actually saying you want an image sized 200px
x 400px
to display in full - then just set Width
to 200px
. 如果您实际上要说的是要完全显示
200px
x 400px
的图像,则只需将Width
设置为200px
。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.