css实现背景渐变叠加

线性渐变效果图:
css 复制代码
.box{
      width: 100vw;
      height: 100vh;
      background:linear-gradient(to bottom,transparent,#fff 30%),linear-gradient(to right,pink,skyblue);
    }
径像渐变效果图:
css 复制代码
.box{
      width: 100vw;
      height: 100vh;
      background:linear-gradient(to bottom,transparent,#fff 300px), radial-gradient(90% 200px at left top,pink,transparent),radial-gradient(60% 200px at right top,rgb(45, 229, 25),transparent);
    }
相关推荐
轻口味36 分钟前
Vue.js 与 RESTful API 集成之使用 Axios 请求数据
前端·vue.js·restful
~废弃回忆 �༄1 小时前
CSS中相对定位使用详情
前端·css·css中相对定位使用详情
inxunoffice1 小时前
批量压缩与优化 Excel 文档,减少 Excel 文档大小
前端·excel
清羽_ls2 小时前
react useEffect函数清除副作用函数执行时机
前端·javascript·react.js
蜜獾云2 小时前
nginx: [error] invalid PID number ““ in “/usr/local/nginx/logs/nginx.pid“
java·前端·nginx
奶糖 肥晨2 小时前
基于 Vue 和 Element Plus 的时间范围控制与数据展示
前端·vue.js·elementui
難釋懷2 小时前
JavaScript数据类型简介
前端·javascript
怣疯knight2 小时前
网页缩放的html代码
前端·html
AntonCook2 小时前
前端AI探索之大模型变智能体
前端·ai 编程
Riesenzahn3 小时前
TypeScript中支持的访问修饰符有哪些?
前端·javascript