css - 使用 SVG 平铺时只显示一次组

标签 css svg background

我正在设计一个使用 SVG 文档作为背景的网站。我希望此图像平铺在 X 轴上。这很好用,但我想知道是否可以在 SVG 中只显示一次组,以便在后续的图 block 中隐藏该组。

Visualisation of what I want to achieve

上图形象化了我想要实现的目标。具有一组(在图像中的红色圆圈)的图像在以下图 block 中不可见。

现在我知道这些事情可以使用额外的 CSS 背景来实现,但我真的很感兴趣是否可以使用单个 SVG 背景来实现这样的事情。

提前致谢!

最佳答案

答案是否定的。如果您依靠 CSS 来平铺背景 - 即。使用repeat-x,然后没有。没有任何办法可以做你想做的事。当 SVG 像那样用作背景时,它就变得不可变了 - 实际上与 PNG 或 JPEG 相同。

您需要使用不同的方法。

关于css - 使用 SVG 平铺时只显示一次组,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40907030/

相关文章:

javascript - 导航栏粘滞在 html 中无法正常工作

php - div定位的概率

javascript - 在多边形内包含 png/svg?

javascript - D3 Firefox 问题显示图表不正确 - 根本不显示任何 SVG

css 背景渐变不填满整个背景

jQuery 交叉淡入淡出与背景图像

html - HTML 中灵活的页眉、可滚动正文和页脚

angular - 非常大的嵌套数组 ngFor SVG 渲染性能问题,架构问题

css - 如何使用 CSS 制作以下菜单?

css - 如何在 Appery 中更改 ionic 应用程序按钮组件的颜色