设置SVG的长宽比

Question

我有许多来自流行品牌的.svg徽标可用于图像轮播。我的问题是图片的尺寸不同，而品牌最终却像这样...

Argos图像比Apple和Epic徽标小得多。理想情况下，我希望它们都具有相同的长宽比，以使它们很好地契合在一起。

如何使用CSS或JavaScript做到这一点？

Answer 1

将元素的max-width设置为某个像素大小。

.svg {
   max-width: 125px;
}

如果您使用百分比（50％），则宽度为400px的svg将具有200px，而宽度为1000px的svg将具有500px，因此该方法将不起作用。

在上面的示例中，我使用了.svg类来定位它们，但是您可以简单地使用svg或将它们放在具有所需类名的div中。