根据原始图像大小调整 <img> pic答案

【问题标题】：resize <img> pic based on original image size根据原始图像大小调整 <img> pic
【发布时间】：2022-01-14 15:39:42
【问题描述】：

在使用引导程序的 React 应用程序中获取要在标签中使用的图像文件时，有时我会在大图像容器中得到一个小图像，它看起来很糟糕。因此，我想得到原始图像大小，然后如果太小，则根据其原始高度和宽度进行缩放。图像保存在 react 应用程序的服务器中，在“上传/图像”下。前任。 “uploads/images/John_Doe.png”，图片源包含在变量“user.pfp”中

<img className="mx-auto d-block" src={user.pfp} style={{maxWidth:'400px', maxHeight:'325px', scale: {*user.pfp height < 100 pixels and user.pfp width < 100 pixels* ? "200%" : "100%"}} />

不知道如何根据图片源找到原图的高宽，以确定是否需要缩放。

当我们讨论这个主题时，我对 react 和一般的 html 图像容器是新手。在这些情况下，“小于”和“和”的正确语法是什么？

【问题讨论】：

标签： html reactjs image

【解决方案1】：

<p><img src="image/example.jpg" alt="Example1" width="193" height="130"> (width:193px, height:130px)</p>

<p><img src="image/example.jpg" alt="Example2" width="96" height="65"> (width:96px, height:65px)</p>

<p><img src="image/example.jpg" alt="Example3" width="100%" height="130"> (width:100%, height:130px)</p>

来源：www.tagindex.net

【讨论】：