缩放未知大小的SVG

Question

我想在固定大小的块中显示svg图像。我想在块内显示未失真且尽可能大的图像。我的问题是图像是由用户提供的，所以我不知道它的尺寸。有没有办法只使用CSS？

Answer 1

不，你不能只使用CSS。告诉浏览器如何扩展SVG以填充其父容器的属性在SVG本身中定义。特别是有四个属性可以控制缩放：

1. width
2. height
3. viewBox
4. preserveAspectRatio

前两个可以用CSS覆盖，但最后两个不能。如果您无法控制SVG，则无法保证它具有viewBox或preserveAspectRatio。

但是，您可以使用Javascript操作viewBox和preserveAspectRatio属性。