在小屏幕上移除页脚下方的空白区域 [英] Remove white space below footer on small screens
本文介绍了在小屏幕上移除页脚下方的空白区域的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我设计网站尽可能快速响应。但不幸的是，White Space Below Footer仅在某些网页上出现在小屏幕上？
如何删除页脚下方的空白区域？
我尝试过的方法：
主页 [ ^ ]
上面链接到我工作的页面
I design the website to be responsive as possible.But unfortunately, White Space Below Footer appear on small screens only in some website page?
How to remove this White space below the footer?
What I have tried:
HomePage[^]
The above is link to the pages i work on
推荐答案
You could implement sticky footer on your page very easily which would force the footer to the bottom of the view port if the content is insufficient to fill the height.
1)Add a div around your entire page like wrapper
<body>
<div class="wrapper">
<header>
...
</footer>
</div> <!-- /wrapper -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<script src="js/index.js"></script>
</body>
</html>
然后添加此CSS
then add this CSS
html,body {height:100%;}
body {margin:0;}
.wrapper {
display:table;
width:100%;
height:100%;
}
header,main,footer {display:table-row;}
header,footer {height:1px;}
这篇关于在小屏幕上移除页脚下方的空白区域的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
