Question

我正在尝试制作页脚，但左右两侧显示出一些空白区域。如何删除空格？

这是我的代码：

<html>
<head>
  <style>
    footer {
      background: none repeat scroll 0% 0% #DFDFDE;
      padding: 120px 0px;
      text-align: center;
      position: relative;
    }
    .divider {
      background: url('http://evablackdesign.com/wp-content/themes/ebd/images/footer-border.png')
      repeat-x scroll center center transparent;
      height: 7px;
      width: 100%;
      position: absolute;
      top: -6px;
    }
    .container {
      width: 930px;
      margin: 0px auto;
    }
  </style>
</head>
<body>
  <footer>
    <div class="divider"></div>
    <div class="container">
      <h1>hiiiiiiiii</h1>
      <br>
      <h2>buyyyyyyyyyyyy</h2>
    </div>
  </footer>
</body>
</html>

enter image description here image of footer

标记定义文档或部分的页脚。

元素应包含有关其包含元素的信息。

页脚通常包含文档的作者，版权信息，使用条款链接，联系信息等。

Answer 1

正文有默认的边距。通过以下方式删除它：

html,body {
    margin:0;
    padding:0;
}

Answer 2

大多数Web浏览器都具有不同的基本边距和填充的默认设置。这意味着如果你没有在你的身体和html标签上设置边距和填充，你可能会在页面上得到不一致的结果，具体取决于你用来查看页面的浏览器。

解决此问题的最佳方法是将html和body标签上的所有边距和填充设置为0：

html, body {
    margin: 0px;
    padding: 0px;
}

Answer 3

将此添加到您的样式标记...

body {
  margin: 0;    
}

Answer 4

只需确保将此类添加到您的 CSS 样式中即可。

.container-fluid {
  width: 100%;
  margin: 0px;
  padding: 0px;
}

Answer 5

试试这个代码：

html, body {
  width: 100%;
  margin: 0; 
  padding: 0; 
  overflow-x: hidden;
}

Answer 6

你的身体有一个默认的边距和填充，你需要覆盖它。在您的样式类型的开头。

file:/scripts/XXXXXXXX/conf/list_${option.--serv.value}-componentes.json

Answer 7

*{
width: 100%;
height: 100%;
padding: 0px;
margin: 0px;
overflow-x: hidden;
}

如何删除页面左侧和右侧的空白区域？

7 个答案: