Question

如何使用每个块内的图像进行此形状？每个块将具有100％的宽度。看看这个例子：

我这里有多边形，但是如何在不丢失纵横比的情况下将其作为100％的svg并使用完整的图像背景？

`https://jsfiddle.net/acrr120/t9y950qy/`

Answer 1

只需将您的svg包裹在容器中，然后提供您想要的height，并通过这种方式提供overflow:hidden，您将定义高度您希望并尊重 svg

的比率

.container {
  height: 500px;
  overflow: hidden;
}

<div class="container">
    <svg width="100%" viewBox="0 0 100 100" style="border:1px solid red">
      <polygon points="0,0 30,10 100,10 100,100 0,100" fill="red" />
    </svg>
</div>

CSS3多边形与图像，如何？

1 个答案: