如何将背景图像重复为块

Question

是否可以将背景图像重复为块？当我将div设为100％宽度并将高度设置为70px时，此图像重复良好，但问题取决于盒子的宽度，有时一半的项目显示出来并且没有任何意义。如果没有重复的空间应该结束，我希望整个图像重复。有可能吗？

＆＃13;

＆＃13;

#wrapper {
  background-color: #E3E3E3;
  position: relative;
  padding: 55px 0 0 0;
}
#notepadTop {
  display: block;
  position: absolute;
  top: -24px;
  left: 0;
  width: 100%;
  height: 70px;
  background: url('http://i.imgur.com/lbW0QX6.png') repeat;
}

＆＃13;

<div id="wrapper">
  <div id="notepadTop">

  </div>
</div>

＆＃13;

＆＃13;

＆＃13;

这是图片

Answer 1

尝试在css中添加：

background-repeat: round

所以，你有：

#notepadTop {
  display: block;
  position: absolute;
  top: -24px;
  left: 0;
  width: 100%;
  height: 70px;
  background-image: url('http://i.imgur.com/lbW0QX6.png');
  background-repeat: round;
}

值round是一个新的CSS3选项，因此无法在IE8及以下版本上工作（您不应该担心它）。

Answer 2

如果我理解了您的问题，那么您正在寻找background-size: cover;