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);
    }
相关推荐
Danta29 分钟前
HTTP协议版本演进:从HTTP/0.9到HTTP/3的高分面试回答
前端·网络协议·面试
柠檬树^-^42 分钟前
app.config.globalProperties
前端·javascript·vue.js
太阳花ˉ1 小时前
react(一):特点-基本使用-JSX语法
前端·react.js
赵大仁1 小时前
深入解析 React Diff 算法:原理、优化与实践
前端·react.js·前端框架
1024小神1 小时前
vue/react/vite前端项目打包的时候加上时间最简单版本,防止后端扯皮
前端·vue.js·react.js
轻口味2 小时前
Vue.js 与 RESTful API 集成之使用 Axios 请求数据
前端·vue.js·restful
~废弃回忆 �༄2 小时前
CSS中相对定位使用详情
前端·css·css中相对定位使用详情
inxunoffice3 小时前
批量压缩与优化 Excel 文档,减少 Excel 文档大小
前端·excel
清羽_ls3 小时前
react useEffect函数清除副作用函数执行时机
前端·javascript·react.js
蜜獾云3 小时前
nginx: [error] invalid PID number ““ in “/usr/local/nginx/logs/nginx.pid“
java·前端·nginx