有2种背景颜色的CSS按钮

Question

我遇到创建一个按钮的问题，该按钮有2种颜色，3种状态，结构如下：

| bgcolor1（白色文字）| bgcolor2（白箭头）|正常状态

| bgcolor2（白色文字）| bgcolor2（白箭头）|悬停状态

| bgcolor3（白色文字）| bgcolor4（白色箭头）|活跃状态

我的方法是使用主色作为bg颜色，并使具有单独背景颜色的箭头成为背景图像。我遇到的问题是箭头的第三种状态，它具有不同的背景颜色。

这可以通过纯css来实现吗？

可以将单个代码段用于包含单行和多行文本的按钮吗？

谢谢你抽出时间帮忙！

Answer 1

使用<button>元素，其中包含标记（例如图像或跨度）。虽然解决了不同的问题，但这个答案可能会有所帮助：Putting Images Inside a BUTTON Element (HTML & CSS)。