在html中调整SVG的大小?

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (2)
  • 关注 (0)
  • 查看 (26)

所以,我在HTML中有一个SVG文件,我听说过的一个关于格式的东西是,当你放大它时,它不会得到所有的像素。

我知道用jpeg或其他任何东西,我可以将它存储为50×50图标,然后通过手动设置图像中的高度和宽度,将其显示为(相当像素的)100×100缩略图(或10×10)。_SRC标签。

但是,SVG文件似乎与对象/嵌入标记一起使用,而更改这些文件的高度或宽度只会导致为图片分配更多的空间。

是否有任何方法可以指定希望显示的SVG图像比实际存储在文件系统中的要小或更大?

提问于
用户回答回答于

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

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

擦除宽度和高度属性;默认值为100%,因此它应该扩展到容器允许的任何内容。

用户回答回答于

试试这些:

  1. 设置丢失视图框并在SVG标记中填写设置的高度和高度属性的高度和宽度值。
  2. 然后简单地缩放图片设置高度和宽度期望百分比价值。祝你好运。
  3. 设定一个固定的高宽比preserveAspectRatio="X200Y200 meet(例如200页),但没有必要

G.

 <svg
   xmlns:dc="http://purl.org/dc/elements/1.1/"
   xmlns:cc="http://creativecommons.org/ns#"
   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
   xmlns:svg="http://www.w3.org/2000/svg"
   xmlns="http://www.w3.org/2000/svg"
   xmlns:xlink="http://www.w3.org/1999/xlink"
   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
   width="10%" 
   height="10%"
   preserveAspectRatio="x200Y200 meet"
   viewBox="0 0 350 350"
   id="svg2"
   version="1.1"
   inkscape:version="0.48.0 r9654"
   sodipodi:docname="namesvg.svg">

扫码关注云+社区