请教各位前端大佬像这种效果怎么实现

[imherer]

如图，这个背景（还有点玻璃质感和纹路）除了用两张不同颜色的图片实现外 纯 css 能实现么？

[freak118]

两个背景图叠起来不就行了 通过变化上边一条的宽度控制

[ahswch]

这个大佬的博客你翻下 应该有类似的 https://www.cnblogs.com/coco1s/

[murmur]

用图片很丢人么，这种纯灰度的 png 图片，能又几个 kb ，还能百分之一千还原设计师的设计

[lisongeee]

svg 加 滤镜就行

[imherer]

@murmur 不要先入为主。我是后端，我就是看到了想来讨论下看看 css 能不能实现。没说图片丢人啦

[darknoll]

https://www.philxu.cn/gl-widget/gl-widget.html#glwidget%E8%83%8C%E6%99%AF
这是你想要的效果妈？

[imherer]

@darknoll 嗯，这个就直接用 2 张图片拼起来的效果吧

[marcong95]

不考虑兼容性的话，那就用 clip-path 剪一个伪元素出来咯（这东西），手撸 svg 有点丑，凑合一下

https://codepen.io/marcong95/pen/BaJooyN

[marcong95]

@marcong95 #8 （括号内删掉）

[clandyuki]

纯 css 也可以，比如这样，波浪不是很还原，应该也够用了
https://jsfiddle.net/pfda2qjg/21/

[xingyuc]

@imherer 这人什么贴都杠，屏蔽就好了

[imherer]

@xingyuc 哈哈

[murmur]

@imherer 前端陷入了娱乐圈，什么东西都想炫技，随着浏览器的兼容性改善，能用的技术越来越多，但是开发容易进入死胡同

[imherer]

@murmur 大佬说的是