关于css的mask属性，如何做一个带边框的镂空效果？-灵析社区

大概可以参考我之前的一篇笔记 👉 [CSS 中的遮罩属性 mask/masks ](https://link.segmentfault.com/?enc=bRFm7CIfMS3qEqoKjfR7YA%3D%3D.vAhOP9KniEX7lQ93%2ByFhtgLEO95p9ffipPBflQ3o%2BJdLhrMT8GJi9fT3jvj%2F9uMQ)。 至于你需求的红色边框，可以参考我笔记里面实现的阴影，一样用 `filter: drop-shadow()` 来实现，只不过需要调整一下模糊半径和扩展半径。 [drop-shadow() - CSS：层叠样式表 | MDN](https://link.segmentfault.com/?enc=y3OY95%2BIF7CNZ4guZoHdcw%3D%3D.BbyTl1JTBVR%2BOKUdvnDzFZf8iDFW3j5sR8aUtsL2IRD4A5mnddIr4%2BUn6ulemdHJzBucz73avT7Nt6wmoZgsZE6qlEcPHSH3g%2FLNWLO9uN8%3D) * * * #### Edit 10/16/2023 我记错了，`filter: drop-shadow()` 的扩散半径（`spread-radius`）值各浏览器并没有是实现。因为最近一直用的 `firefox` 作为主力开发浏览器，所以在看到MDN关于这部分的介绍时以为只有 `firefox` 没有支持（其实这些浏览器都不支持）。  以及一张简单模拟的效果:  如果扩展半径参数可以被应用上的话，就可以和 `box-shadow` 一样使用阴影来模拟边框了。