我写的实践篇 都是自己在实践项目所遇到的 “拦路虎”

还是很有借鉴的意义的。(实践才是检验真理的唯一标准呀),废话不多说,进去正题

没错,不做处理的话,是会遮住的(定位 脱离了文档流)。

[css 实践篇]  解决悬浮的<header>   <footer>遮挡内容的处理技巧

很简单:增加同高度占位元素

一目了然。直接贴代码

 

 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> 

 

 

出来后的效果图

[css 实践篇]  解决悬浮的<header>   <footer>遮挡内容的处理技巧

 

头部分被遮挡了,也是很简单的给元素 一个上边距就好了呀!

同样给占位元素,也是可以达到理想效果的(不信,你可以试试看。自己动手才是丰衣足食哦)

 

 小技巧你学会了吗?

 

相关文章:

  • 2021-11-12
  • 2021-08-19
  • 2021-12-09
  • 2021-06-30
  • 2022-12-23
  • 2022-12-23
  • 2021-12-29
猜你喜欢
  • 2021-10-05
  • 2021-06-04
  • 2022-03-05
  • 2021-09-15
  • 2022-12-23
  • 2021-04-29
  • 2022-12-23
相关资源
相似解决方案