我的问题是:
页面上有“添加到购物车”按钮: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 像素宽)，但在此页面中，它非常适合带有文本“添加到购物车”和相同背景 120 像素宽的按钮。 这个背景图像如何自动从 279 像素调整为 120 像素宽度？
这个页面是如何完成的？
因为我想为不同的网页按钮使用相同的 width 按钮背景图像，具有不同的文本长度。
最佳答案
这不是一张背景图片，而是两张。该按钮是 div 中的一个跨度:
<div class="button"><span>button text</span></button>
div 上的背景图像显示按钮的左侧，span 上的背景图像显示按钮的右侧。该技术称为“CSS 滑动门”。看看this article .
关于html - 如何在表单按钮中自动调整背景图像的大小？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/4813112/