HTML/CSS中的按钮

我有以下按钮：

我需要使用HTML/CSS3来完成它。我试过很多方法，比如径向梯度

我试过-webkit梯度（线性）和-webkit梯度（径向

---

有什么帮助或想法？？

< P>使用CSS，我能得到的最接近的只是一个线性梯度，从上到下。底部的一点光与CSS相当困难。你可能需要考虑一个图像，如果它不是大的话，不会影响性能太多。

您可能希望观察服务器端编码的性能，因为这是大多数情况下的问题。如果是因为您需要加载大量图像，您可以获取站点上的所有图像并将其放在单个文件中，并且始终获取该文件，但背景位置不同。StackOverflow也使用此方法。此技术称为使用精灵编辑

有关其功能和工作方式的指南，请参见：

这是我得到的最接近的结果：

div{
背景图像：-moz径向梯度（50%100%，黄色，#FFCC00，黄色）；
背景图像：-webkit径向梯度（50%100%，黄色，#FFCC00，黄色）；
背景图像：径向梯度（50%100%，黄色，#FFCC00，黄色）；
高度：47px；
宽度：202px；
边界半径：5px；
文本对齐：居中；
线高：47px；
字体大小：粗体；
字体系列：无衬线；
颜色：#AA8100；
}

径向渐变仅适用于圆形或椭圆，因此如果没有图像或css画布，您将无法获得该样式…

您可以给出您尝试过的代码吗？此外，仅使用图像可能更容易创建背景。为什么您需要使用css？我需要使用css，因为我们正在优化代码，而它不需要o加快速度。