css实现多色悬浮菜单背景伸缩动画效果代码-html代码-BFW代码库

css实现多色悬浮菜单背景伸缩动画效果代码

代码语言：html

所属分类：悬停

代码描述：css实现多色悬浮菜单背景伸缩动画效果代码

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

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">






    <style>
        body{
          margin: 0px;
          padding: 0px;
          background: #e74c3c;
          font-family: 'Lato', sans-serif;
        }
        
        nav{
          float: none; 
          clear: both;
          width: 30%; 
          margin: 10% auto;
          background: #eee;
        }
        
        nav ul {
          list-style: none;
          margin: 0px;
          padding: 0px;
        }
        
        nav li{
        	float: none; 
          width: 100%;
        }
        
        nav li a{
          display: block; 
          width: 100%; 
          padding: 20px; 
          border-left: 5px solid; 
          position: relative; 
          z-index: 2;
          text-decoration: none;
          color: #444;
          box-sizing: border-box;  
          -moz-box-sizing: border-box;  
          -webkit-box-sizing: border-box; 
        }
        	
        nav li a:hover{ border-bottom: 0px; color: #fff;}
        nav li:first-child a{ border-left: 10px solid #3498db; }
        nav li:nth-child(2) a{ border-left:.........完整代码请登录后点击上方下载按钮下载查看