用纯CSS实现镂空效果的示例代码

近来研究了一下镂空效果。 background-clip: text 背景被裁剪为文字的前景色。第一次是在 CSS-Tricks 看到的这个用法: 在 CSS-Tricks 网站上,这个玩意用得到处都是。 这样,做简单的图片背景镂空效果便不再困难了。关键代码只有几行。 .wrapper { /* ... */ background-image: url("/path/to/your/image"); background-clip: text; /* ! */ color: transparent; /* ! */ } 就这几行,视觉上会就会有大变化。前后对比: 另外