Question

我正在处理一个模板，并且已经放置了布局，但是当我来到CSS并开始对About部分进行样式设置时，我不会进入标题；现在为什么！

  <div class="header">
    <div class="overlay">
        <div class="container">


                  <h1>This is Urban</h1>


                  <p>Aliquam libero augue varius non odio nec faucibus congue
                    felis quisque a diam rutrum tempus massa accumsan faucibus purus.</p>


                  <button>learn more</button>

        </div>
    <div>
  </div>

  <!-- End header -->

  <!-- start about me -->

  <div class="about-me">
    <div class="container">


          <img src="" alt="my-img">
          <h3>Maecenas a gravida quam</h3>


          <button>learn more</button>

    </div>
  </div>


/* start header */

.header {
 background-color: #555;
padding-top: 30px;
padding-bottom: 30px;
}

/* end header */

/* start about me */

.about-me{
padding-top: 30px;
padding-bottom: 30px;
}

如何解决这个问题？它已经和我指责了几次

Answer 1

您可以在标题div的末尾添加Clear fix元素。

像这样<div class="header> <div class="clearfix"></div></div>"

，您必须添加CSS之类的

.clearfix{clear:both;}

我希望它对您有用，或者也可以共享html代码会更好

在标头div的结束标记之前添加具有class clear fix的div。

您也可以在“关于我”部分的末尾使用相同的清除修订div，也可以对所有部分使用

Answer 2

您可以在标题div的末尾添加Clear fix元素。

像这样<div class="header> <div class="clearfix"></div></div>"

，您必须添加CSS之类的

.clearfix{clear:both;}

我希望它对您有用，或者也可以共享html代码会更好

提供标题position:relative;，然后将此CSS添加到覆盖div {position:absolute; top:0; left:0; height:100%; width:100%; }

在我的网站上，开发人员进入了另一个解决方案[html]

2 个答案: