为按钮中的图标添加背景色

Question

我刚刚创建了this code。

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

有没有办法在上面的演示中用红色背景填充整个按钮的左侧？

Answer 1

只需将此代码添加到.button的css

背景颜色:颜色；

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: red; /*<-----This is valid CSS*/

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