当CSS中的尺寸未知时，如何增加图像的宽度？
欧米茄
我有一个类似的图片标签
<img />
然后，我动态下载指向图像的链接，并将图像src设置为该链接。我不知道链接中图像的尺寸。我是否可以使用CSS代码来确保图像的宽度恰好为200像素（没有裁剪，只需拉伸即可适合）并且图像的高度与原始图像相同？（因此，当原始尺寸未知时，基本上就是水平比例）。无论我如何尝试，似乎都可以保留宽高比。
谢谢
这是一个示例：我正在动态加载此图像： 
我不知道它的尺寸，但是最后，我希望它看起来像（假装它的宽度为200像素）。
普拉提帕瓦尔
这就是您要寻找的。
function formatImage(t)
{
//var t = document.getElementById("idOfImg");
alert(t.naturalWidth + " " + t.naturalHeight);
t.height = t.naturalHeight;
t.width = "200";
}
在每个image您要此行为添加onload=formatImage(this);
JSFiddle https://jsfiddle.net/94rzcLh6/
Lmk，如果有效。我没有在小提琴上使用适当的命名，请忽略这一点。
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
编辑于
相关文章
Related 相关文章
- 1
如何在悬停时增加边框宽度而又不移走CSS中的div位置？
- 2
CKFinder如何在选择图像（文件：选择）时获取尺寸URL和尺寸（宽度/高度）？
- 3
如何仅在一页中增加图像的宽度
- 4
如何改善在网格中更改未知尺寸图像的动画的性能？
- 5
当图像从容器的宽度增加到整个视口宽度时，如何对其进行动画处理？
- 6
当图像从容器的宽度增加到整个视口宽度时，如何对其进行动画处理？
- 7
如何在GridView中基于屏幕尺寸设置图像宽度高度
- 8
如何在GridView中基于屏幕尺寸设置图像宽度高度
- 9
在 flex 容器中，如何防止 100% 宽度的图像扩展到主体尺寸？
- 10
如何在TensorFlow中重复未知尺寸
- 11
悬停时如何增加元素的宽度
- 12
如何在Android中增加屏幕尺寸
- 13
如何在Docker中增加终端尺寸
- 14
如何为未知尺寸的图像添加偏移边框？
- 15
旋转时如何编辑图像尺寸？
- 16
环绕图像时CSS段落的最小宽度
- 17
图像显示大于 CSS 中设置的尺寸
- 18
当包含在GridBagLayout中时，如何使我的Panel自动换行并增加高度而不是宽度？
- 19
尺寸未知时如何创建一维范围张量？
- 20
如何在固定尺寸的浮动框中将未知尺寸的图像居中？
- 21
如果我尝试更改图像的宽度和高度，图像尺寸会增加。我应该怎么做才能获得缩小尺寸的图像？
- 22
使用jquery / javascript单击时增加/减少css宽度
- 23
如何在不增加太多内容的情况下增加图像的背景尺寸？
- 24
缩小PNG图像会增加图像尺寸
- 25
图像高度为15％，并且当屏幕尺寸小于图像宽度时，缩放高度是多少？
- 26
Android中的相机，如何获得最佳尺寸，预览尺寸，图片尺寸，视图尺寸，图像失真
- 27
Android中的相机，如何获得最佳尺寸，预览尺寸，图片尺寸，视图尺寸，图像失真
- 28
如何在python中重塑图像的尺寸
- 29
如何在CSS中以任何屏幕尺寸在背景封面内保留长图像？
我来说两句