linear-gradient设置渐变位置
时间: 2023-09-19 16:11:02 浏览: 91
深入剖析CSS中的线性渐变linear-gradient
linear-gradient可以通过百分比来设置渐变位置。在参数中,每一种颜色后面跟着一个百分比,表示当前颜色的过渡位置。如果前后两个颜色的过渡位置一样,则不会出现平滑渐变效果,而是突然变化。举个例子,如果我们希望在水平方向上将一个颜色从左边渐变到右边,可以使用类似以下代码的方式设置渐变位置:background: linear-gradient(to right, #30e8bf50%, #ff823550%); 这里的50%表示第一个颜色和第二个颜色的过渡位置都是距离渐变起点的50%处。
阅读全文