如何删除这两个 DIV 之间不需要的空间？答案

【问题标题】：How to remove unwanted space between these two DIVs?如何删除这两个 DIV 之间不需要的空间？
【发布时间】：2016-02-29 12:14:51
【问题描述】：

我有两个宽度为 100% 的 div 我有问题我在 div 之间获得空间我正在使用引导程序并尝试了不同的 CSS 属性但没有任何反应我想要它们之间的 0 边距无法弄清楚它是如何完成的

我的代码：

          .sec-one {
            height: 200px;
            width: 100%;
            background-color: pink;
          }
          .sec-two {
            height: 200px;
            width: 100%;
            background-color: red;
            text-align: center;
          }
          #header h1 a {
            display: inline-block;
            text-decoration: none;
            font-size: 1.8em;
            color: white;
            margin-top: 90px;
          }

<html>

<head>
  <link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
</head>

<body>

  <div class="sec-one">

  </div>

  <div class="sec-two">

    <div id="header">
      <h1><strong><a href="">A Heading</a></strong></h1>
    </div>

  </div>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
</body>

</html>

【问题讨论】：

问题是引导程序适用于h1 的边距。你需要重置它。见安东尼奥的回答...stackoverflow.com/a/33938050/3170478

标签： html css twitter-bootstrap

【解决方案1】：

h1 {font-size:0px} //it will also work in case display:inline-block of div's

【讨论】：

感谢您的回答先生

【解决方案2】：

试试这个

.sec-one {
    height: 200px;
    width: 100%;
    background-color:pink;
  }

  .sec-two{
    height: 200px;
    width: 100%;
    background-color:red;
    text-align: center;
  }

  #header h1 a {
    display: inline-block;
    text-decoration: none;
    font-size: 1.8em;
    color: white;
    margin-top: 90px;
  }
h1
{
    margin:0;
  }

 <div class="sec-one">

  </div>

  <div class="sec-two">

    <div id="header">
      <h1><strong><a href="">A Heading</a></strong></h1>
    </div>

  </div>

【讨论】：

【解决方案3】：

只需在样式表中插入h1 {margin:0px} 即可。

在我的示例中，该属性位于顶部。

Example

【讨论】：

非常感谢@Antonio Smoljan