如何在Bootstrap中的頁腳之后刪除HTML，Body的神秘空間？

Question

我是CSS響應編碼的新手。 我使用了預制的boostrap模板並對其進行了修改。 它的工作正常。 唯一的問題是，當在Firefox響應設計工具上以不同大小查看此網站時，頁腳后會出現一個神秘的空白。

當我嘗試在Firefox響應式設計工具上查看以下網頁時，請查看以下屏幕截圖，其中顯示了神秘的空白：768x1024。 我們如何刪除或隱藏此多余空間？ 我努力了; 溢出：隱藏 但它不起作用。 檢查此網站鏈接以獲取頁面的在線版本

請檢查圖像截圖。

Answer 1

頁面底部是您的頁腳元素。

.footer, .push {
  height: 155px;
}

另外，您的修復程序很麻煩，並且無法始終運行：

.wrapper {
  margin: 0 auto -155px;
}

Answer 2

該空間是由於該站點對於特定設備而言“不夠長或不夠高”。 您可以通過而不是在.wrapper元素上使用height:auto來解決它，而應使用height:100vh 。

.wrapper {
    min-height: 100%;
    height: 100vh !important;
    margin: 0px auto -155px;
    border: 1px solid #F00;
}

100vh將獲得正在使用的特定視口的垂直高度，因此它將始終占據屏幕。

這是有關“ 垂直視口高度”的更多信息

希望這可以幫助！