将背景颜色添加到按钮中的图标

Question

我刚刚创建了this code。

如您所见，在左侧，灰色图标后面有红色背景颜色，但红色背景不会填满按钮的整个左侧。

在上面的演示中，有什么方法可以用红色背景填充按钮的整个左侧吗？

Answer 1

只需将其添加到.button的css

即可

background-color：颜色;

Answer 2

检查此更新cssdeck。为按钮类（.button）和悬停效果（背景颜色）添加了背景颜色。

Answer 3

有两个CSS属性可以做到这一点：

---

背景色：

如果您只想用单一颜色填充背景，请使用此属性。您可以使用颜色名称或HTML颜色代码执行此操作：

background-color: red;
background-color: #ff0000;

---

背景

使用此属性一次分配多个效果，例如：

background: red url("some-image.png") no-repeat;

这会将您的背景设置为使用图像“some-image.png”作为整个尺寸，然后用红色填充图像无法到达的空白区域。

background也可以与background-color相同的方式工作：

background: red; /*<-----This is valid CSS*/

您还可以使用background来实现渐变，可以在Colorzilla轻松创建渐变。

Answer 4

您可以将background: #f5f5f5;更改为 background-color: red;。看看它是否有效。 ：）