可以用于滚动到一定距离以后让他实现定位效果。

比如滚动到50px的时候让导航栏固定定位。

用法：给最外层的div设置绝对定位

然后要固定的div设置position：sticky;

top：0；

这样就实现了滚动到一定距离固定定位的效果。

sticky用法的更多相关文章

  1. position:sticky用法

    用户的屏幕越来越大,而页面太宽的话会不宜阅读,所以绝大部分网站的主体宽度和之前相比没有太大的变化,于是浏览器中就有越来越多的空白区域,所以你可能注意到很多网站开始在滚动的时候让一部分内容保持可见,比如 ...

  2. CSS布局技巧 -- sticky属性

    在一些很长的表格中,往往需要使用表头悬浮的设计以方便用户使用,例如H5电商页面通过下滑展示大量商品列表时,顶部的导航栏需要在离开屏幕时,需要固定在屏幕顶部以方便用户筛选类别.这种效果一直以来需要通过J ...

  3. CSS3的position:sticky介绍

    用户的屏幕越来越大,而页面太宽的话会不宜阅读,所以绝大部分网站的主体宽度和之前相比没有太大的变化,于是浏览器中就有越来越多的空白区域,所以你可能注意到很多网站开始在滚动的时候让一部分内容保持可见,比如 ...

  4. setuid、setgid、sticky的权限简单用法

    如何设置setuid.setgid.sticky的权限: setuid :置于 u 的 x 位,原位置有执行权限,就置为 s,没有了为 S . chmod 4xxx file chmod u+s xx ...

  5. linux的strace命令用法

    strace命令用法 调用:strace [ -dffhiqrtttTvxx ] [ -acolumn ] [ -eexpr ] …[ -ofile ] [ -ppid ] … [ -sstrsize ...

  6. 粘滞位（sticky bit）

    linux特殊权限:setUid, setGid, 粘着位(sticky) (1)目录的X权限(执行) 文件的可执行权限很简单,也就是可否执行它的意思,但目录的执行权限又代表什么意思呢? 当然不可能是 ...

  7. Shell语法中的test命令用法

    test命令用法.功能:检查文件和比较值   1)判断表达式 if test (表达式为真) if test !表达式为假 test 表达式1 –a 表达式2 两个表达式都为真 test 表达式1 – ...

  8. perl的一些基本用法

    ReadLine support available (try 'install Bundle::CPAN')cpan>进入cpan的shell,好了,我为了安装spamassassin,需要安 ...

  9. 使用 position:sticky 实现粘性布局

    如果问,CSS 中 position 属性的取值有几个?大部分人的回答是,大概是下面这几个吧? { position: static; position: relative; position: ab ...

随机推荐

  1. hdu-1045.fire net(缩点 + 二分匹配)

    Fire Net Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)Total Su ...

  2. JDK11 | 第一篇 : JDK11 介绍

    文章首发于公众号<程序员果果> 地址 : https://mp.weixin.qq.com/s/cOqRVlDgOqfDfKtkk1JGxw 一.简介 北京时间 2018年9 月 26 日 ...

  3. linux安装curl出错

    今天配置一台server的php支持curl的时候, 出现如下报错 checking for cURL in default path... not foundconfigure: error: Pl ...

  4. 用命令行远程导出MySQL数据

    mysqldump -h10.10.9.197 -uroot -proot --default-character-set=utf8 0610_eshop >C:/Users/Adm inist ...

  5. Java OO知识总结

    接着上一集    https://www.cnblogs.com/pdev/p/11288014.html       5. OO中的一些基本概念 继承 父类的非private方法自动被子类继承 cl ...

  6. 剑指offer学习读书笔记--二维数组中的查找

    在一个二维数组中,每一行都按照从左到右递增的顺序排序,每一列都是按照从上到下递增的顺序排序.请设计一个函数,输入这样的一个二维数组和一个整数,判断数组是否含有这个整数. 1 2 8 9 2 4 9 1 ...

  7. Java JNA （四）—— void**、void*、char**、char*、int*等类型映射关系及简单示例

    ByReference类有很多子类,这些类都非常有用. ByteByReference.DoubleByReference.FloatByReference. IntByReference.LongB ...

  8. spring boot generator

    pom.xml 插件引用依赖 <build> <plugins> <plugin> <groupId>org.springframework.boot& ...

  9. CF527E Data Center Drama

    链接CF527E Data Center Drama 题目大意:给你一个无向图,要求加最少的边,然后给这些无向图的边定向,使得每一个点的出入度都是偶数. \(n<=10^5,n\leq 2*10 ...

  10. Java第二阶段之常用类

    包装类缓存-128到127之间的数字(系统初始的时候就创建了,当我们调用ValueOf时,首先检查是否在范围内,在则直接取用)integer in1 ＝ integer.valueOf(-128):i ...