Html Base64映像将不会使用任何常用方法缩小

我正在使用KendoUI的图表功能，并希望导出生成的构造以显示为缩略图

我正在导出Base64格式的图像。然后保存该文件

然后，这些数据被加载到一个div中，需要进行缩放以适应div。然而，我已经尝试了所有常用的技术来缩小图像，但它根本不会

现在我有这样的东西。它是一段html，用作基诺列表的模板。这里可能有什么东西导致了这个问题，但我没有找到它，如果有

<div id="thumbnailContainer" style="height: 100%; width: 100%;">
   <img id="thumbnail" src="#:imageData#" style="(every technique under the 
   sun tried)"
</div>

其中“#：imageData”对应于someBase64图像数据（以其他方式正确显示和加载）

尝试过的技术：

• 背景尺寸
• 改为设置容器的背景
• 调整img的高度和宽度

---

尝试在代码中执行此操作

<img id="thumbnail" src="'data:image/png;base64,' + your_base64_string" style="width:50px;height:250px">

---

这应该行得通。如果它不起作用，那么您可能会对其他css有问题。

您没有提到它是一个SVG，而不仅仅是一些图像。SVG在调整大小时是“特殊的”。最好不要将SVG设为base64，因为它不会节省空间或为您带来任何好处。诀窍是添加

viewBox=“0 0 W H”“

到

标记。在您的情况下，

viewBox='0 0 2400 1200'

似乎运行良好。如果坚持使用base64，则需要在转换它之前添加它

---

您是否尝试将容器的宽度和高度设置为图像所需的大小？请提供一个可复制的示例，以便我们提供帮助。@Hiddenhobes看不到我在哪里编辑我的问题，但是我修改了一个现有的JSFIDLE来说明这个问题：我现在有一个JSFIDLE示例来说明这个问题：如果你按照你的建议去做，它似乎只是裁剪图像，而不是使用css转换进行缩放：缩放（0.5，0.5）我现在可以做得很棒！谢谢，这让我发疯了，我没想到SVG会有什么不同。为了节省我的时间，你知道改用PDF是否可以让缩放工作正常吗？哦，不，PDF甚至可能不会显示为图像。如果您只想显示缩略图，最好是将svg渲染为图像。看看。它使用PHP和ImageMagickCheers，正如您可能知道的，我不熟悉在html中呈现各种图像格式。我去看看，谢谢你的帮助