Javascript React中的SVG图像大小

我有一个必须导入的SVG图像。原始图像太大，因此必须将其缩小

这是在代码中添加的图像：

  render() {
    return (
      <div>
        <Grid>
          <img src={mySvgImage}></img>
          //other elements
        </Grid>
    </div>
    );
}

render（）{
返回(
//其他要素
);
}

使用开发人员工具时，我发现如果在Styles>element.style中添加：高度：10%，则图像大小会缩小到所需大小。就像这里：

那么如何在代码中实现这一点呢

我像内联CSS一样添加了它，但不起作用：

  render() {
    return (
      <div>
        <Grid>
          <img style={{ heigth: '10%' }} src={mySvgImage}></img>
          //other elements
        </Grid>
    </div>
    );
}

render（）{
返回(
//其他要素
);
}

尝试将其保存在css文件中，并使用

className='myClassName'

导入，相同，没有更改。图像具有原始大小

---

如何做到这一点？

您可能有一个打字错误：

// not heigth
<img style={{ height: '10%' }} src={mySvgImage}></img>

//不高

.imgClassName{
身高：10%；
}

heigth似乎是一个打字错误

.imgClassName {
  height: 10%;
}

<div>
  <Grid>
    <img className="imgClassName" src={mySvgImage}></img>
  </Grid>
</div>