Css 类似线性渐变的设计，其中颜色2位于中心，颜色1位于侧面

很抱歉，如果标题不能很好地描述它，但是我想做的是模仿下面的设计

假设我使用

#1A6592

作为蓝色。有没有可能使它在中间褪色为白色？我看过不同的线性渐变生成器，例如，但看不到它们有什么方法可以做到这一点，所以我不确定是否可以使用CSS

---

这里有一个演示小提琴：

此时CSS中只能使用

线性

和

径向

渐变，因此实现这一点的方法是使用三种输入颜色，最外面的两种颜色相同，中间的一种为白色。下面是一个例子：

。褪色的蓝色背景{
背景#2989d8；
背景：-moz线性梯度（左，#2989d8 0%，#7D9E8 50%，#2989d8 100%）；
背景：-webkit渐变（线性、左上、右上、颜色停止（0%，#2989d8）、颜色停止（50%，#7db9e8）、颜色停止（100%，#2989d8））；
背景：-webkit线性梯度（左，#2989d8 0%，#7D9E8 50%，#2989d8 100%）；
背景：-o-线性梯度（左，#2989d8 0%，#7db9e8 50%，#2989d8 100%）；
背景：-ms线性梯度（左，#2989d8 0%，#7db9e8 50%，#2989d8 100%）；
背景：线性梯度（向右，#2989d8 0%，#7db9e8 50%，#2989d8 100%）；
过滤器：progid:DXImageTransform.Microsoft.gradient（startColorstr='#2989d8'，endColorstr='#2989d8'，GradientType=1）；
填充：20px；
}
.褪色的蓝色背景h3，.褪色的蓝色背景li{color:#FFF；}

这是一个div

这里有一个列表项
这里有一个列表项
这里有一个列表项
这里有一个列表项

请使用以下方法：

background: linear-gradient(to bottom, #1a6592 0%,#ffffff 50%,#1a6592 100%);