在 html 中调整 SVG 的大小? [英] Resizing SVG in html?

问题描述

所以，我有一个 HTML 格式的 SVG 文件，我听说过关于这种格式的一件事是当你放大它时它不会全部像素化.

So, I have an SVG file in HTML, and one of the things I've heard about the format is that it doesn't get all pixelated when you zoom in on it.

我知道用 jpeg 或任何我可以将它存储为 50 x 50 图标的东西，然后通过手动设置高度和宽度，实际将其显示为(相当像素化的)100 x 100 缩略图(或 10 x 10)在 image_src 标签中.

I know with a jpeg or whatever I could have it stored as a 50 by 50 icon, then actually display it as a (rather pixelated) 100 by 100 thumbnail (or 10 by 10), by manually setting the height and width in the image_src tag.

然而，SVG 文件似乎与 object/embed 标签一起使用，并且更改 THOSE 的高度或宽度只会导致为图片分配更多空间.

However, SVG files seem to be used with object/embed tags, and changing the height or width of THOSE just results in more space being allocated for the picture.

有什么方法可以指定您希望显示的 SVG 图像比实际存储在文件系统中的尺寸要小还是大?

IS there any way to specify that you want an SVG image displayed smaller or larger than it actually is stored in the file system?

推荐答案

使用文本编辑器(它只是 XML)打开您的 .svg 文件，并在顶部查找类似的内容:

Open your .svg file with a text editor (it's just XML), and look for something like this at the top:

<svg ... width="50px" height="50px"...

擦除宽高属性；默认值是 100%，所以它应该延伸到容器允许的范围.

Erase width and height attributes; the defaults are 100%, so it should stretch to whatever the container allows it.

这篇关于在 html 中调整 SVG 的大小?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！