css中按钮用图片代替

CSS中，按钮是一个很重要的元素。我们在网页设计中常常会用到各种样式的按钮，比如实心按钮、空心按钮、圆角按钮等等。在按钮的制作中，我们常常会使用图片来代替字体或背景色，以达到更好的效果。下面我们就来看看如何使用图片来制作按钮。

.button {
  background-image: url("button-image.png");
  background-size: cover;
  width: 100px;
  height: 40px;
} 

在上面的代码中，“.button”是我们给按钮定义的一个类名，在CSS中通过类名来定义样式。接下来是我们真正关注的，即“background-image”属性。这个属性指定了背景图片的路径，我们可以通过URL来指定具体的路径。在本例中，我们将背景图片放在了当前文件夹下，文件名为“button-image.png”。

接下来是“background-size”属性，用来指定图片的大小。我们可以通过设置宽度、高度、百分比或像素值来实现，常常使用的属性值有：cover（铺满父元素），contain（尽量放大图片但不超过父元素大小）等等。在本例中，我们将背景图片的大小设置为“cover”，即尽量铺满按钮的大小。

最后是利用“width”和“height”属性来指定按钮的大小，这个部分跟普通的CSS样式差不多，不需要过多的解释。

综上所述，使用图片来制作CSS中的按钮是一项比较简单的技术。需要注意的是，图片的大小和适配是需要根据具体需求进行调整的，也需要考虑一些兼容性和缓存优化的问题。