渐变角冲突
Gradient angle conflict
大家好，我正在使用简单的 CSS 渐变：
background: linear-gradient(225deg, red 0%, white 10%, #aaaaaa 50%, #cccccc 56%, white 80%);
现在看下图：
看到 225 度角从左下角开始，但是在 CSS example 中它是从渐变开始的右上角。为什么 ？？
我参考了关于渐变的 MDN 文档，事实上 W3c's examples 本身非常擅长解释渐变，但仍然无法弄清楚这一点。
谢谢。
亚历山大。
Angles in CSS 零角不是在右边，而是在上面。正角是顺时针的，不是逆时针的。
linear gradient中的设置不指定渐变的起点，而是指定渐变的终点。因此，225度角的终点在左下角，所以它从右上角开始。
这个度数意味着你的渐变颜色沿着 225 度。和大多数数学定理一样，起点是 (0, 0)，原点。
起点表示 0%，在您的 css 代码中为红色。
如果你想让颜色从左下角开始到右上角，你应该应用 45 度。
度也表示向量。 [1 1]' 是 45 度，表示向量从左下角开始到右上角。 [-1 -1]' 为 225 度，表示矢量从右上角开始到左下角。
大家好，我正在使用简单的 CSS 渐变：
background: linear-gradient(225deg, red 0%, white 10%, #aaaaaa 50%, #cccccc 56%, white 80%);
现在看下图：
看到 225 度角从左下角开始，但是在 CSS example 中它是从渐变开始的右上角。为什么 ？？
我参考了关于渐变的 MDN 文档，事实上 W3c's examples 本身非常擅长解释渐变，但仍然无法弄清楚这一点。
谢谢。
亚历山大。
Angles in CSS 零角不是在右边，而是在上面。正角是顺时针的，不是逆时针的。
linear gradient中的设置不指定渐变的起点，而是指定渐变的终点。因此，225度角的终点在左下角，所以它从右上角开始。
这个度数意味着你的渐变颜色沿着 225 度。和大多数数学定理一样，起点是 (0, 0)，原点。 起点表示 0%，在您的 css 代码中为红色。
如果你想让颜色从左下角开始到右上角，你应该应用 45 度。
度也表示向量。 [1 1]' 是 45 度，表示向量从左下角开始到右上角。 [-1 -1]' 为 225 度，表示矢量从右上角开始到左下角。