scrollnav.umd实现自动生成单页锚点导航效果代码-html代码-BFW代码库

scrollnav.umd实现自动生成单页锚点导航效果代码

代码语言：html

代码描述：scrollnav.umd实现自动生成单页锚点导航效果代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">







    <style>
        body {
          font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
          margin: 0;
          padding: 0;
        }
        
        @media screen and (min-width: 800px) {
          .scroll-nav {
            float: right;
          }
        }
        @media screen and (max-width: 799px) {
          .scroll-nav {
            text-align: center;
          }
        }
        
        .scroll-nav__list {
          margin: 0 auto;
          padding: 0;
          list-style-type: none;
        }
        .scroll-nav__list:after {
          content: "";
          display: table;
          clear: both;
        }
        @media screen and (max-width: 799px) {
          .scroll-nav__list {
            display: inline-block;
          }
        }
        
        .scroll-nav__item {
          margin-bottom: 5px;
          float: left;
          margin-right: 15px;
          border-bottom: 1px solid transparent;
        }
        
        .scroll-nav__item--active {
          font-weight: 600;
          border-bottom-color: white;
        }
        
        .scroll-nav__link {
          color: white;
          text-decoration: none;
        }
        
        .page__header {
          position: sticky;
          top: 0;
          padding: 15px 10px;
          background: black;
        }
        .page__header:after {
          content: "";
          display: table;
          clear: both;
        }
        
        .page__title {
         .........完整代码请登录后点击上方下载按钮下载查看