makoshen 2022-02-11 17:41 采纳率: 100%
浏览 132
已结题

layui 网站中 这个悬浮目录 是怎么实现的？

img


https://www.layui.site/doc/element/layout.html

  • 写回答

4条回答 默认 最新

  • 崽崽的谷雨 2022-02-11 17:45
    关注

    html 锚点 了解一下 如果只是悬浮 那固定定位即可 。如果实现 点击跳转到对应位置 ，html锚点可以实现

    <!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <style>
    .box {
      width: 50px;
    }

    .ml {
      position: fixed;
      right: 20px;
      top: 260px;
      border: 1px solid red;
      width: 200px;
      height: 150px;
    }

    /* ul{
      list-style: none;
    } */
    ul>li {
      width: 100%;
      height: 40px;
      line-height: 40px;

    }
    .vv{
           /* margin-top:800px ; */
    }
  </style>
</head>

<body>
  <div class="box">
   
    88888888888888888888888888888888888888888899
    999999999999999999999999999999999999999999999
    99999999999999999999999999999999999999999999999
    9999999999999999999999999999999
    88888888888888888888888888888888888888888899
    999999999999999999999999999999999999999999999
    99999999999999999999999999999999999999999999999
    9999999999999999999999999999999
    88888888888888888888888888888888888888888899
    999999999999999999999999999999999999999999999
    99999999999999999999999999999999999999999999999
    9999999999999999999999999999999
    88888888888888888888888888888888888888888899
    999999999999999999999999999999999999999999999
    99999999999999999999999999999999999999999999999
    9999999999999999999999999999999
    88888888888888888888888888888888888888888899
    999999999999999999999999999999999999999999999
    99999999999999999999999999999999999999999999999
    9999999999999999999999999999999
    88888888888888888888888888888888888888888899
    999999999999999999999999999999999999999999999
    99999999999999999999999999999999999999999999999
    9999999999999999999999999999999
    88888888888888888888888888888888888888888899
    999999999999999999999999999999999999999999999
    99999999999999999999999999999999999999999999999
    9999999999999999999999999999999
    88888888888888888888888888888888888888888899
    999999999999999999999999999999999999999999999
    99999999999999999999999999999999999999999999999
    9999999999999999999999999999999
    9999999999999999999999999999999
    9999999999999999999999999999999
    9999999999999999999999999999999
    9999999999999999999999999999999
    9999999999999999999999999999999
    9999999999999999999999999999999
    9999999999999999999999999999999
    9999999999999999999999999999999
    9999999999999999999999999999999
    9999999999999999999999999999999
    9999999999999999999999999999999
    <div class="vv">
      <a name="001" id="001">001 </a>
    111111111111111111111111111111111111111111
    111111111111111111111111111111111111111111
    11111111111111111111111111111111111111
    </div>
  </div>
  <div class="ml">
    <ul>
      <li> <a href="#001">跳到001</a></li>
      <li>444</li>
    </ul>
  </div>
</body>

</html>

    https://blog.csdn.net/ddwddw4/article/details/106145196/

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论 编辑记录
查看更多回答(3条)

报告相同问题？

问题事件

  • 系统已结题 2月22日
  • 已采纳回答 2月14日
  • 创建了问题 2月11日

悬赏问题

  • ¥50 导入文件到网吧的电脑并且在重启之后不会被恢复
  • ¥15 （希望可以解决问题）ma和mb文件无法正常打开，打开后是空白，但是有正常内存占用，但可以在打开Maya应用程序后打开场景ma和mb格式。
  • ¥20 ML307A在使用AT命令连接EMQX平台的MQTT时被拒绝
  • ¥20 腾讯企业邮箱邮件可以恢复么
  • ¥15 有人知道怎么将自己的迁移策略布到edgecloudsim上使用吗？
  • ¥15 错误 LNK2001 无法解析的外部符号
  • ¥50 安装pyaudiokits失败
  • ¥15 计组这些题应该咋做呀
  • ¥60 更换迈创SOL6M4AE卡的时候，驱动要重新装才能使用，怎么解决？
  • ¥15 让node服务器有自动加载文件的功能