luxy实现一个滚动视觉差异单页落地介绍页代码

代码语言:html

所属分类:视觉差异

代码描述:luxy实现一个滚动视觉差异单页落地介绍页代码

代码标签: luxy 滚动 视觉差异

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

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">
    <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/normalize.css">
    <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/all.min.css">

    <style>
        body {
          background-color: #111;
          font-family: 'Roboto', sans-serif;
          color: #eee;
        }
        
        h1 {
          font-family: 'Oswald', sans-serif;
          line-height: 5rem;
          font-size: 5rem;
          font-weight: 500;
        }
        
        p {
          line-height: 1.7rem;
        }
        
        img {
          object-fit: cover;
          filter: grayscale(100%);
        
        }
        
        
        
        .logo {
          font-weight: 900;
          position: fixed;
          padding: 2rem 5rem;
          z-index: 100;
          font-family: 'Oswald', sans-serif;
        }
        
        .logo-inline {
          font-weight: 900;
          font-family: 'Oswald', sans-serif;
        }
        
        .navbar {
          position: fixed;
          right: 0;
          padding: 2rem 5rem;
          z-index: 100;
        }
        .navbar a {
          color: #eee;
          text-decoration: none;
          padding-left: 2rem;
          font-size: .8rem;
        }
  .........完整代码请登录后点击上方下载按钮下载查看

网友评论0