Html 侧边栏从左到右渐变，但也向下渐变

我有一个我必须创建的边栏，它有一个从左到右的渐变，这很好，但是当它到达底部时，它也会在垂直方向上消失。你知道如何实现这一目标吗？我四处看看，但找不到解决办法。谢谢

您可以将渐变与

遮罩

.box{
宽度：100px；
高度：200px；
背景：线性渐变（向右、红色、蓝色）；
-webkit遮罩图像：线性渐变（白色，透明）；
遮罩图像：线性渐变（白色，透明）；
}

请向我们展示您迄今为止尝试过的方法您是指对角线梯度吗？是的，这非常有效，从未听说过这种方法。谢谢！