我想使用100％宽度的svg图像，该图像具有从左上角到右下角的填充背景。我尝试了几种方法使它始终保持100％的宽度（背景尺寸等），但它不起作用。
如果我打开svg源代码，则有几种“固定”宽度。也许这就是问题所在。但是我不知道该如何解决。
如果我可以将此swg放置为div的背景，那就太好了。（使用CSS）
这是我的svg代码：
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 18.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="1280px" height="70px" viewBox="0 0 1280 70" enable-background="new 0 0 1280 70" xml:space="preserve">
<polygon points="1280,70 0,70 0,0 "/>
</svg>
有人知道如何解决此问题吗？我还考虑了另一种方法，即使用旋转的div容器。但是我认为svg是最好的方法。
在这里，您可以看到一个示例：
删除宽度和高度
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 1280 70" enable-background="new 0 0 1280 70" xml:space="preserve" preserveAspectRatio="none">
<polygon points="1280,70 0,70 0,0 "/>
</svg>
的CSS
svg{width:100%}
更新：将svg保存为文件并像这样使用
.element {
background-image: url(image.svg);
/* other styles */
}
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句