具有宽度约束的径向CSS渐变？
这是我试图用CSS渐变构建的按钮渐变:
这通常很容易做到,但正如您所看到的,顶部的渐变看起来更像是一个大的剪切径向渐变,因为它在中间向下倾斜并且不会一直延伸到边缘.
那么,任何想法如何用CSS来解决这个问题？
在css中,径向背景中心不能位于其容器之外,但您可以通过使用渐变定位子元素来偏移径向背景.基本上你想要做这样的事情:
这是接近simshaun的优秀解决方案.但是,既然我喜欢挑战,我想尝试零额外加价的东西,我想出了这个:
这与你的解决方案非常接近,没有额外的标记.它只是一个带有插入阴影的线性渐变,可以衰减按钮的左右边缘.