css导航_html/css_WEB-ITnose

body { width:960px; margin: 40px auto; }

#menu { height:40px; width:100%; background:#1b1717; list-style:none; border-radius:5px; }

#menu li { float:left; list-style:none; width:130px; }

#menu a { top:10px;

padding:10px 40px 10px 40px;

position:relative;

text-transform: uppercase;

font: bold 12px/25px Arial, Helvetica;

}

#menu ul { display:none; }

#menu ul li{ background:#2b2b33;

position:relative;

width:130px;

height:40px;

left:-40px;

top:15px;

border-bottom:1px solid;

border-bottom-color:white;

}

#menu li:hover > ul { display: block; }

#menu ul ul li { position:relative; top:-25px; left:90px; background:#2937a7; }

/*第一个小三角代码*/

#menu ul li:first-child > a:after{ content: ''; display: inline-block; border-left: 6px solid transparent; border-right: 6px solid transparent; border-bottom: 6px solid #CCC; position: absolute; top: -10px; left: 60px; }

/*第二个小三角代码*/

#menu ul ul li:first-child a:after{

　　　　left: -8px;

　　　　top: 12px;

　　　　border-left: 0px;

　　　　border-bottom: 5px solid transparent;

　　　　border-top: 5px solid transparent;

　　　　border-right: 8px solid #444; }

• Hone

  　　　

  • item11

    　　　　

  • item11

• Graphic