用HTML / CSS中的图像替换图标

Question

我想在html / css上创建一个漂亮的盒子，就像那样：

我正在尝试将图标更改为：

以下是原始代码：

#pricing-table .pricing .pricing-list ul li i {
  margin-right: 12px;
  color: #bdc3c7;
}

通过应用此更改，它不起作用：

#pricing-table .pricing .pricing-list ul li i {
  margin-right: 12px;
  background-image: url("./Startup Framework Inspired Pricing Table_files/images/background.jpeg");
}

我试过这个并且它正在工作，但这是最佳方式吗？

<li>
  <img id="icons" src="./Startup Framework Inspired Pricing Table_files/images/icon.jpg">
  <span> +/- % </span> MTD
</li>

Answer 1

如果您使用background-image，则必须为元素指定一些宽度和高度