CSS遮罩:mask

CSS属性 mask 允许使用者通过遮罩或者裁切特定区域的图片的方式来隐藏一个元素的部分或者全部可见区域。

css 复制代码
// 一般用位图图片做遮罩
mask: url('~@/assets/images/mask.png');
mask-size: 100% 100%;

// 使用 SVG 图形中的形状来做遮罩 
mask: url('~@/assets/images/mask.svg#star');  

// 使用渐变来做遮罩
mask: linear-gradient(#000, transparent)


相关推荐
爱上好庆祝2 小时前
svg图片
前端·css·学习·html·css3
whuhewei7 小时前
JS获取CSS动画的旋转角度
前端·javascript·css
冰暮流星14 小时前
javascript之dom访问css
开发语言·javascript·css
榴莲omega15 小时前
第13天:CSS(二)| Grid 布局完全指南
前端·css·js八股
牧杉-惊蛰15 小时前
修改表格选中时的背景色与鼠标滑过时的背景色
前端·javascript·css·vue.js·elementui·html
xiaokuangren_1 天前
前端css颜色
前端·css
hhcccchh1 天前
1.2 CSS 基础选择器、盒模型、flex 布局、grid 布局
前端·css·css3
军军君011 天前
Three.js基础功能学习十六:智能黑板实现实例三
前端·javascript·css·vue.js·3d·前端框架·threejs
军军君011 天前
Three.js基础功能学习十四:智能黑板实现实例一
前端·javascript·css·typescript·前端框架·threejs·智能黑板
web_小码农1 天前
CSS 3D动画 旋转木马示例(带弧度支持手动拖动)
javascript·css·3d