2 
.step-1-4 {
  background:url('../images/gadget-4-sprite.png') 
  no-repeat; width:950px; 
  height:70px;
  margin-left: 15px;
}

以上是我拥有的包含背景图像的 div 的 CSS。我已将 div 的高度和宽度设置为与图像的尺寸相同。我遇到的问题是当窗口重新调整大小时，例如小于图像的宽度，它会被切断。

有没有一种解决方案，我可以通过这种方式设置 CSS 样式，使 div 与其中的图像一起重新调整大小。我尝试将 div 的宽度设置为 100%，这样可以正确调整 div 的大小，但是图像仍然没有调整大小。也许如果这不是一个好的解决方案，那么如何使用<img>标签来实现。

4

1 回答 1

1

使用background-size:cover;或background-size:100% 100%;

所以你的CSS将是::

.step-1-4 {
  background:url('../images/gadget-4-sprite.png') no-repeat;
  background-size:100% 100%; /*..or  cover ...*/
  width:950px; 
  height:70px;
  margin-left: 15px;
}
于 2013-09-09T10:56:18.160 回答