SVG 多边形填充 svg 父级

Question

我有一个 svg 多边形，我正在尝试让多边形填充到 svg 容器的大小。更改高度和宽度属性会按预期缩放多边形，但是我不希望多边形和 svg 之间有任何空白。有没有办法不用重做积分就可以实现？

<?xml version="1.0" encoding="UTF-8"?>
<svg width="20px" height="20px" viewBox="0 0 20 20" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
    <title>2</title>
    <g id="2" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
        <polygon id="Rectangle" fill="#000000" points="6 4 14 4 14 12.6416575 10 16 6 12.6416575"></polygon>
    </g>
</svg>

Answer 1

您可以改为调整 viewBox，例如

<svg width="20px" height="20px" viewBox="6 4 8 12" preserveAspectRatio="none" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="background-color:red">
    <title>2</title>
    <g id="2" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
        <polygon id="Rectangle" fill="#000000" points="6 4 14 4 14 12.6416575 10 16 6 12.6416575"></polygon>
    </g>
</svg>

SVG 多边形填充 svg 父级

SVG polygon to fill svg parent

html

svg

polygon