css吸顶(position: sticky；)

  • 开发
  • 90

用样式position: sticky;来做吸顶其实很简单，只要在设置一个top属性即可。

.tabs-s{
   
	position: sticky;
	background: #fff;
	top:60rpx;
	width:100vw;
	height:80rpx;
}

解释下上面的效果：当元素tabs-s滑动到距离顶部60rpx的时候，会“固定”在那个地方，不会随着页面的向上滑动而滑动；但是向下滑动距离顶部小于60rpx的话，那元素tabs-s也会跟着向下滑动

阅读全部

相关推荐

  1. css吸顶(position: sticky；)

    2023-12-28 20:14:02       91 阅读

  6. vue3 element-plus el-table表头冻结，表头吸顶

    2023-12-28 20:14:02       57 阅读

  9. SV-7043VP 20W SIP网络有源吸顶喇叭

    2023-12-28 20:14:02       36 阅读

最近更新

  3. docker php8.1+nginx base 镜像 dockerfile 配置

    2023-12-28 20:14:02       94 阅读

  4. Could not load dynamic library ‘cudart64_100.dll‘

    2023-12-28 20:14:02       100 阅读

  9. 在Django里面运行非项目文件

    2023-12-28 20:14:02       82 阅读

  19. Python语言-面向对象

    2023-12-28 20:14:02       91 阅读

  20. 如何分清楚常见的 Git 分支管理策略Git Flow、GitHub Flow 和 GitLab Flow

    2023-12-28 20:14:02       85 阅读

热门阅读

  5. 【排序算法】合并两个有序数组

    2023-12-28 20:14:02       58 阅读
  6. MongoDB

    MongoDB

    2023-12-28 20:14:02      56 阅读
  7. Tekton

    Tekton

    2023-12-28 20:14:02      51 阅读

  8. MongoDB中的物化视图

    2023-12-28 20:14:02       58 阅读

  17. 2022年全国职业院校技能大赛软件测试赛项赛题库

    2023-12-28 20:14:02       55 阅读

  18. Linux安装mysql

    2023-12-28 20:14:02       60 阅读

  19. 全国计算机等级考试| 二级Python | 真题及解析(1)

    2023-12-28 20:14:02       49 阅读

  20. 机器学习概述（一）

    2023-12-28 20:14:02       36 阅读

  25. 备忘录模式（Memento）

    2023-12-28 20:14:02       60 阅读