背景向右重复答案

【问题标题】：Background repeat to the right背景向右重复
【发布时间】：2013-12-02 10:39:55
【问题描述】：

我怎样才能只在我的网站布局上重复我的背景图片。我的图像宽 1 像素，高 400 像素，我希望它是屏幕宽度的 100%。

我以为是……

CSS：

#bg-image {
  background-image: url("images/bg.png")
  background-repeat:repeat-y;
  background-size: 100%; 
 }

HTML：

<div class="wrapper">
  <div class="bg-image"> 
  </div>
</div>

但这不起作用。我查看了其他 StackOverflow 答案，但找不到与我的问题类似的答案。任何有帮助的赞赏欢呼

【问题讨论】：

改变背景-repeat:repeat-x
body { background: url(../images/bg.png); }

标签： html css image background repeat

【解决方案1】：

尝试将height:auto 分配给应用背景图像的 Div，并将其包含在您希望扩展的 Div 下。

<div class="OuterDiv">
    <div class="backgroundImage"></div>
</div>

CSS

.OuterDiv
{
    height:100%;
}

.backgroundImage
{
    background-image:url('someimage.png') repeat-x;
    height:auto;
}

【讨论】：

【解决方案2】：

我认为您将X 与Y 混淆了。你应该使用：

#bg-image {
    background-image: url("images/bg.png");
    background-repeat: repeat-x;
}

【讨论】：

【解决方案3】：

试试这个：

#bg-image
{
background-image:url('paper.gif');
background-repeat:repeat-y;
height: 100%;
}

【讨论】：

【解决方案4】：

你可以试试这个，

#bg-image {
    background-image: url("images/bg.png");
    height: 100%;
}

【讨论】：

是的，还是什么都没有发生

【解决方案5】：

试试这个代码重复水平图像..

repeat-x : Work for Horizontal
repeat-y : Work for Vertical


'CSS
#bg-image {
background-image: url("images/bg.png")
background-repeat:repeat-x;
background-size: 100%; 
}
HTML:
<div class="wrapper">
 <div class="bg-image"> 
 </div>
</div>

【讨论】：