-webkit-gradient linear 转换成 -webkit-linear-gradient

转换对比

输入宽:
输入高:
输入第一 color-stop:
输入第二 color-stop:
输入结束点:
偏移:
旋转角度 α- 90 ℃ :
渐变偏移 h1:
渐变偏移 h2:

分析

webkit-gradient linear 写法到 webkit-linear-gradient 转换,本文只实现 webkit-gradient 的起始点固定0 0,结束点单轴偏移的转换,多 stop 可以类推出来,负值情况稍变化下,x 轴分析见下图( y 轴同理)。

限高不限宽对比

webkit-graident 因为根据两点计算角度,所以角度会改变