[css 實踐篇] 解決懸浮的 遮擋內容的處理技巧

我寫的實踐篇 都是本身在實踐項目所遇到的 「攔路虎」

仍是頗有借鑑的意義的。（實踐纔是檢驗真理的惟一標準呀），廢話很少說，進去正題

position: fixed 絕對固定底部後會擋住內容

沒錯，不作處理的話，是會遮住的（定位 脫離了文檔流）。

很簡單：增長同高度佔位元素

一目瞭然。直接貼代碼

 

 1 <!-- footer外包裹一層div-->
 2 <div>
 3     <!--充當佔位符的div塊，無實質內容 -->
 4     <div style="height:60px;"></div> 
 5 
 6     <!--fixed懸浮出來的footer -->
 7     <section class='footer'>
 8         <div class='reply-topic'>回覆主題</div>
 9     </section>
10 </div> 

 

 

出來後的效果圖

 

頭部分被遮擋了，也是很簡單的給元素 一個上邊距就行了呀！

一樣給佔位元素，也是能夠達到理想效果的（不信，你能夠試試看。本身動手纔是豐衣足食哦）

 

 小技巧你學會了嗎？