css - 从中心开始的水平线性渐变(非径向)

Question

是否存在从中心开始但不是径向形式的 CSS 线性渐变？

---

我已经查找过这方面的文档

我发现了很多 documentation对于从左到右的线性渐变以及径向渐变。但这不是我想要的效果。

---

如果您想知道为什么不直接使用径向渐变

这是一个横跨网页高度的侧边栏。我希望它看起来很像一个圆柱体。这就是我不想使用径向效果的原因，因为这会将侧边栏视为球体。

---

其他选项

我知道我可以镜像两个独立的线性渐变并将它们并排放置以伪造所需的效果。

---

最后一个问题

但是，我想知道是否有一个预置的选项来实现实际所需的效果？

Answer 1

也许我遗漏了什么，但一个线性渐变应该可以解决问题:

background: linear-gradient(to right, rgba(0,0,0,1) 0%,rgba(255,255,255,1) 50%,rgba(0,0,0,1) 100%);

这从黑色开始，在中心变成白色，然后又变回黑色。