tk挠痒痒网址发布页-秘密武器
历史搜索

CSS 如何解决H5布局中的吸顶和吸底

游客2025-05-16 11:12:01
目录文章目录
  1. 局部吸顶
  2. 弹性吸底
  3. 总结

最近做了一个需求,准确说是迭代需求:加了一个头部概览(类似下图),以更好的让用户观察到营销变化,故事的开头就这样悄悄的埋下了伏笔。

以前这个页面只是一个评价列表(可上拉加载),为了数据更易读,列表的头采用了固定布局。然而加了这个概览时,产品没提,我就简单粗暴的将这个列表头换成了相对布局,ok,提测。

CSS 如何解决H5布局中的吸顶和吸底 1

更多关于-webkit-fill-available, 参见[allthingssmitty];

总结

vh 确实是个好东西,可以解决移动端的适配问题。我个人觉得作为一个合格的前端,CSS 仍然是必备技能,不要对 JS 产生太多的依赖,不是不可以,而是好钢要用在刀刃上。

演示 Demo 地址(手机端打开

演示 Demo 源码 点击这里

标签:CSS

本文是由用户"游客"发布,所有内容的版权归原作者所有。没有经过书面许可,任何单位或个人不得以任何形式复制、转载、引用本网站的内容。否则将追究法律责任。

相关专题