css背景透明模糊渐变
时间: 2023-11-09 18:01:51 浏览: 191
CSS 背景渐变
可以使用CSS3中的background属性来实现背景透明模糊渐变效果。具体实现方法如下:
```
background: linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(255,255,255,0.5) 50%,rgba(255,255,255,0.8) 100%), url(图片地址);
backdrop-filter: blur(10px);
```
其中,linear-gradient用于设置渐变背景,to bottom表示从上到下渐变,rgba(255,255,255,0)表示透明的白色,0%表示从顶部开始,rgba(255,255,255,0.5)表示半透明的白色,50%表示中间位置,rgba(255,255,255,0.8)表示更浓的白色,100%表示底部位置。url(图片地址)用于设置背景图片。
backdrop-filter用于设置背景模糊效果,blur(10px)表示模糊半径为10像素。
阅读全文