时间戳

首页 > 解决方案 > 页脚下方不必要的空间

html - 页脚下方不必要的空间

问题描述

所以我试图添加一个页脚，但它最后有 2 行的不必要空间，并且在页面的背景颜色中也是如此。我该如何解决？

footer {
    text-align: center;
    background-color: orange;
    margin-bottom: -200px;
    height: 5em;
}

.contact {
    padding: 0px;
}

.contact a {
    color: black;
    margin-top: 30px;
}  

    
<footer>
  <div class="container contact">
    <div class="row">
      <div class="col-md-12 align self-center">
        <p> Made with ❤ by Team PitchTeen </p>
        <a class="contact-link" href="mailto:teampitchteen@gmail.com">teampitchteen@gmail.com</a>
      </div>
    </div>            
  </div>
</footer>

标签： htmlcssfooter

解决方案

如果“最后有 2 行不必要的空间”，您的意思是链接后的“填充”底部，您可以height从footerCSS 属性中删除，如下所示：

footer {
    text-align: center;
    background-color: orange;
    margin-bottom: -200px;
    /*height: 5em;*/
}

/* useless too now
.contact {
    padding: 0px;
}*/

.contact a {
    color: black;
    margin-top: 30px;
}  
<footer>
  <div class="container contact">
    <div class="row">
      <div class="col-md-12 align self-center">
        <p> Made with ❤ by Team PitchTeen </p>
        <a class="contact-link" href="mailto:teampitchteen@gmail.com">teampitchteen@gmail.com</a>
      </div>
    </div>            
  </div>
</footer>

推荐阅读