linear-gradient需写明方向（如to right）和合法颜色值，逗号分隔且末尾无多余逗号；radial-gradient用circle/ellipse at x y控制圆心，尺寸参数用closest-side等；多层背景须合并到单个background-image并用逗号分隔。
linear-gradient 怎么写才不会白屏
浏览器遇到 linear-gradient 语法错误时，常直接忽略整个背景声明，导致背景变白或回退到默认色——这不是渐变失效，而是 CSS 解析失败。最常见原因是漏写方向关键词或颜色值格式不合法。
- 方向必须明确：用
to top、to bottom right，别只写top（旧语法已废弃） - 颜色之间必须用逗号分隔，末尾不能多逗号；
rgba(0,0,0,0.2)比transparent更可控（后者在某些 Safari 版本中渲染异常） - 示例正确写法：
background: linear-gradient(to right, #ff9a9e, #fad0c4);
radial-gradient 圆心位置和尺寸怎么控制
radial-gradient 默认是椭圆渐变且圆心在中心，但实际项目里经常需要偏移圆心或限定范围，否则在响应式布局中容易“跑偏”。关键在前两个参数：形状 + 圆心坐标。
- 形状可选
circle（正圆）或ellipse（椭圆），不写则按容器宽高自动推导 - 圆心用
at x y指定，比如at 20% 30%表示距左 20%、距顶 30% 的位置 - 尺寸（第三个参数）影响渐变覆盖范围，常用
closest-side（到最近边）或farthest-corner（到最远角）；数值如50px会强制半径 - 示例：
background: radial-gradient(circle at 30% 70%, #6a11cb, #2575fc);
渐变叠加背景图时为什么图片不见了
当同时设置 background-image 多层值（如渐变 + PNG），容易误以为要用多个 background-image 声明——其实必须合并进同一个属性，用逗号分隔，且顺序决定图层上下关系（前在上，后在下）。
