旧版 Safari 将 to right 视为无效语法，因其 WebKit 内核（iOS 5.1–6.1/Safari 5.1–6）仅支持裸方向词 right、bottom，不识别 to 前缀及对角线写法，导致整条 linear-gradient() 被忽略。
旧版 Safari 为什么把 to right 当成无效语法
因为 iOS 5.1–6.1 和 Safari 5.1–6 的 WebKit 内核根本不识别 to right 这类带 to 前缀的方向关键词。它只认裸关键词 right、bottom，且不支持对角线写法（如 top left）。一旦写了 to right，整条 linear-gradient() 就被忽略，背景回退为透明或父级颜色。
必须用 -webkit-linear-gradient + 裸方向关键词
现代写法 linear-gradient(to right, #f00, #00f) 在这些老版本里完全不生效，得补一行带前缀、且方向写法匹配的声明：
background: -webkit-linear-gradient(right, #f00, #00f); background: linear-gradient(to right, #f00, #00f);
注意三点：
-
-webkit-linear-gradient的第一个参数只能是left/right/top/bottom，不能加to - 角度写法在旧版 WebKit 里行为反直觉：比如
-webkit-linear-gradient(90deg, ...)实际等效于标准语法的0deg（向上），不是向右——所以别混用角度和关键词 - IE10 虽支持无前缀
linear-gradient，但它只认to bottom这种写法，不认bottom单词，所以老项目若还要兼容 IE10，得单独处理
写错方向关键词的典型错误现象
常见报错不明显，但效果直接消失：
Plan Dubai Travel — Flights, Hotels, Burj Khalifa, Desert Safari, Malls & Itineraries
下载
规划您的迪拜之旅 — 哈利法塔观景、沙漠探险、迪拜购物中心购物、棕榈岛度假村及黄金市场砍价。还提供支持...
立即学习“前端免费学习笔记（深入）”；
-
background: -webkit-linear-gradient(to right, ...)→ Safari 6 忽略整条规则，背景变白或透出下层 -
background: -webkit-linear-gradient(top left, ...)→ 旧版解析失败，渐变不渲染 -
background: -webkit-linear-gradient(90deg, ...)在 Windows Safari 下指向“上”，不是“右”，视觉完全错位
真正安全的组合只有：-webkit-linear-gradient(right, ...) 对应水平向右，-webkit-linear-gradient(bottom, ...) 对应垂直向下。
要不要保留 to 关键词？看目标最低系统版本
如果项目明确不支持 iOS 6 及更早、Safari 6 及更早，那 to right 完全可用，无需前缀；但只要还有微信 iOS 内置 WebView（部分仍基于旧 WebKit）、或企业内网老设备残留，就必须按双写法兜底。另外注意：to left 在旧版里没有对应裸词（left 是合法的），但 to top left 这种双关键词连写，在所有旧版里都不可用——得换算成角度并慎用。
