jquery+css实现视觉差异滚动模糊固定导航条效果代码

代码语言:html

所属分类:视觉差异

代码描述:jquery+css实现视觉差异滚动模糊固定导航条效果代码

代码标签: jquery 视觉差异 滚动 模糊 导航条

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

<!DOCTYPE html>

<html lang="en">

<head>

   
<meta charset="UTF-8">

   
<style>
        @import url(https://fonts.googleapis.com/css?family=Lato);
        html, body {
          padding: 0;
          margin: 0;
          height: 100%;

        }
       
        html {
          font: 1em/1.5 "Lato", sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
          text-rendering: optimizelegibility;
        }
       
        body {
          font-size: 1.3em;
        }
       
        header {
          height: 100%;
          position: relative;
          overflow: hidden;
          background: url(//repo.bfw.wiki/bfwrepo/icon/6056bf753c238.jpg) center no-repeat;
          /* Image Credit: Unsplash.me */
          background-size: cover;
        }
        header .content {
          position: absolute;
          top: 0;
          left: 0;
          right: 0;
          bottom: 0;
          z-index: 1;
        }
        header h1, header h2 {
          margin: 0;
        }
        header h2 {
       .........完整代码请登录后点击上方下载按钮下载查看

网友评论0