div+css实现丝带导航条菜单效果代码-html代码-BFW代码库

div+css实现丝带导航条菜单效果代码

代码语言：html

代码描述：div+css实现丝带导航条菜单效果代码

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


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

<head>

  <meta charset="UTF-8">
  

  
<style>
@charset "UTF-8";
@import url(https://fonts.googleapis.com/css?family=Cabin);

body {
  font: 14px Cabin;
  margin: 30px 40px;
}

aside {
  background: #a6b7c5;
  box-shadow: inset 1px 1px 8px rgba(0,0,0,0.2);
  min-width: 170px;
  padding: 12px 0;
  width: 20%;
}
aside h1 {
  background-color: #415e77;
  background-image: linear-gradient(transparent, rgba(0,0,0,0.2));
  border-radius: 3px 0 0 3px;
  box-shadow: 0 1px 4px rgba(0,0,0,0.3);
  box-sizing: border-box;
  color: #fff;
  font-size: 1.2em;
  margin: 0 0 24px 12px;
  padding: 4px 0 4px 12px;
  position: relative;
  width: 100%;
}
aside h1:after {
  border-color: #263746 transparent transparent #263746;
  border-style: solid;
  border-widt.........完整代码请登录后点击上方下载按钮下载查看