PNG图片使用CSS遮罩尺寸优化示意实例页面

回到相关文章 »

效果：

代码：

CSS代码：

img {
    -webkit-mask-image: var(https://image.zhangxinxu.com/image/blog/202005/card-mask-min.png);
    mask-image: var(https://image.zhangxinxu.com/image/blog/202005/card-mask-min.png);
    -webkit-mask-size: 300px;
	mask-size: 300px;
}

HTML代码：

<img src="https://image.zhangxinxu.com/image/blog/202005/card.jpg" width="300">