CSS 百分比问题

Question

我有一个显示在页脚 div 中的页脚图像。页脚图像大部分是黑色的，所以我希望页脚左右区域的 div 为黑色并延伸到页面边缘。我无法做到这一点。我将不胜感激任何帮助。下面是我的 css 代码，然后是相关的 HTML 代码： CSS：

body{
width: 1196px;
    margin-top: 2px;
    margin-right: auto;
    margin-bottom: 0px;
    margin-left: auto;
    font-family: Verdana, Geneva, sans-serif;
}

.footer {
    width:1196px;
    float: left;
    height: 572px;
}

HTML：

 <div class="footer"><img src="images/footer.jpg" width="1196" height="572"/></div>

Answer 1

一种方法是从body 中删除固定的width 并将width:100% 赋予footer 然后您可以使用footer img 居中display:block + margin:auto

body {
  margin: 2px auto 0;
  font-family: Verdana, Geneva, sans-serif;
}
.footer {
  max-width: 100%;
  background: black
}
img {
  display: block;
  margin: auto
}

<div class="footer">
  <img src="//dummyimage.com/1196x572" />
</div>