如何使用 CSS 滤镜打造中间黑色不规则色块？

发布日期： 2024-11-08 阅读量： 作者： 网络

css打造不规则色块

要实现如下图所示的中间黑色不规则色块，可以探索滤镜技术的魔力。

如下图中间黑色部分

/* 基底色块 */
.block {
  background: #E0E0E0;
  width: 400px;
  height: 400px;
  margin: 100px auto;
}

/* 黑色滤镜区域 */
.filter {
  background: #000;
  width: 100%;
  height: 100%;
  filter: blur(10px); /* 模糊滤镜 10px */
  opacity: 0.5; /* 设置透明度 */
}

# css # 事件冒泡 # 绝对定位

上一篇: docker运行在哪个目录

下一篇: 群晖docker被停用启用失败怎么解决

如何使用 CSS 滤镜打造中间黑色不规则色块？

随便看看