粘滯頁腳問題CSS
[英]Sticky Footer Issue CSS
問題描述
我試圖制作一個簡單的粘性頁腳但是當我使用margin-bottom時沒有任何反應。 :(任何幫助都會很棒！這是代碼。
<body>
<div class="main">
<center>
<img src="img/profpic.png" style="height:300.5px; width:auto; margin-top:75px; margin-bottom:30px;"/> <br/>
<span style="color:#FFF; font-size:69px;">Hi, $firstname</span> <br/>
<img src="img/button.jpg" style="height:111px; width:auto; margin-top:120px; margin-bottom:135px;"/> <br/>
<span style="color:#FFF; font-size:54px; ">Or Tap Here</span> <br/>
<!--Footer -->
<div style=" margin-bottom:10px; height:10px; width:100%; border-top:solid 1px white; color:#FFF; font-size:46px;">Happyfaxe</div>
</center>
</div>
</body>
2 個解決方案
解決方案1
2 已采納 2014-04-07 23:03:14
margin-bottom會在元素margin-bottom添加空格，但不會將其重新定位到頁面底部。
嘗試將此添加到您的粘性頁腳div：
position:fixed;
bottom:0;
編輯： jsfiddle
解決方案2
0 2014-04-07 23:07:26
margin-bottom只是為它應用的元素添加一個緩沖區。 粘性頁腳有點棘手。 它需要一些特殊的結構才能讓它像你期望的那樣工作。
這是一篇很棒的文章，介紹了如何做你想要做的CSS-Tricks，Sticky footer
這是另一個做同樣的事情： cssstickyfooter.com
粘性頁腳問題-CSS
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.