x 重复背景图像未完全展开答案

【问题标题】：x-repeating background images not fully expandingx 重复背景图像未完全展开
【发布时间】：2014-08-08 01:24:33
【问题描述】：

我现在花了几个小时尝试不同的事情来弄清楚如何在 css 中获取 2 个背景图像来扩展页面的整个宽度。

我知道在#main 中定义宽度不会让它扩展。但是我想不出解决方案。我认为身体应该工作！我能做什么？

非常感谢！

相关的CSS代码是：

body {
background-image:url('http://res-intel.com/images/headerbg.jpg') repeat-x top right;
margin:auto;
padding:0;
text-align: center;
font-family:arial;
}

#main {
background: url('http://res-intel.com/images/contentbg.jpg');
background-repeat:repeat-x;
width:904px; 
text-align:left;
}

【问题讨论】：

图片不存在。 res-intel.com/images/headerbg.jpg。还要检查 background-size: cover;
headerbg.jpg 找不到..我上面的人比我快 10 秒
你不能这样使用background-image:url('http://res-intel.com/images/headerbg.jpg') repeat-x top right;，把它改成background:

标签： html css background background-image background-repeat

【解决方案1】：

您有语法错误。您不能为背景图像添加重复 x 和位置属性。您需要使用类似背景而不是背景图像。如下所示更新您的 CSS。

 body {
  background:url('http://res-intel.com/images/headerbg.jpg') repeat-x top right;
  margin:auto;
  padding:0;
  text-align: center;
  font-family:arial;
 }

【讨论】：