如何在窗体按钮中自动调整背景图像的大小？

Question

我的问题是：

页面上有“添加到购物车”按钮：http://www.ctr-ring.com/lds-book-store/band-ctr-ring-white

.button {
background: url("/sites/all/themes/flexcart/images/button_cart.png") no-repeat scroll right top transparent;
height: 25px;
line-height: 25px;
padding-right: 5px;
} 

“添加到购物车”按钮背景很大(279 in宽)，但在本页中，它很适合于按钮的文本“添加到购物车”和相同的背景120 in宽。如何将背景图像从279 px自动调整到120 px宽度？

这是如何在本页中完成的？

因为我想使用相同的宽度按钮背景图像不同的网页按钮，不同的文本长度。

Answer 1

不是一张背景图像，而是两张。按钮是div中的一个跨度：

<div class="button"><span>button text</span></button>

div上的背景图像显示按钮的左侧，span上的背景图像显示按钮的右侧。这项技术被称为"CSS滑动门“。看看这篇文章。