html自适应导航栏怎么写,超漂亮自适应的导航菜单，纯CSS写的

CSS滑动门导航菜单下载

#top { display: block; text-align: left; height:105px; position: relative; z-index: 0;}

.m { margin:0 auto; width: 970px; }

body{ font-size:12px;}

a{

color:#333;

text-decoration: none;

}

a:link { text-decoration: none; }

a.blue:link, a.blue:visited { color: #014cc9; text-decoration: none; }

a.blue:hover, a.blue:active { color: #014cc9; text-decoration: underline; }

a.org:link, a.org:visited { color: #ff4e00; text-decoration: none; }

a:hover, a:active, a.org:hover, a.org:active { color: #ff4e00; text-decoration: underline; }

#navpart {

background: url(http://p1.mb5u.com/texiao/1/navpartbg1.gif) repeat-x center top;

height: 105px;

width:970px;

z-index: 0;

margin-top: 0;

margin-right: auto;

margin-bottom: 0;

margin-left: auto;

clear: both;

position: relative;

}

#navpart .sideleft { background: url(http://p1.mb5u.com/texiao/1/navpartbg1.gif) no-repeat left bottom; float: left; height: 105px; width: 6px;}

#navpart .sideright { background: url(http://p1.mb5u.com/texiao/1/navpartbg1.gif) no-repeat right bottom; float: right; height:105px; width: 6px}

#navmenubar { height: 32px; float: left; display: inline; margin: 0 -6px; width: 100%; position: relative; z-index: 3; top:0}

#hot { background: url(http://p1.mb5u.com/texiao/1/sign_hot1.gif) no-repeat left top; height: 21px; width: 19px; position: absolute; top: -5px; right: 2px; z-index: 666}

#navmenubar .sideleft { background: url(http://p1.mb5u.com/texiao/1/navmenubg1.gif) no-repeat left bottom; float: left; height: 32px; width: 6px; display: inline; margin: 0 0 0 8px}

#navmenubar .sideright { background: url(http://p1.mb5u.com/texiao/1/navmenubg1.gif) no-repeat right bottom; float: left; height: 32px; width: 6px; display: inline; margin: 0 4px 0 -2px}

/* NAVMENU */

#navmenubar .navmenu { background: url(http://p1.mb5u.com/texiao/1/navmenubg1.gif) repeat-x center top; height: 32px; padding: 0; margin: 0; float: left; display: inline}

#navmenubar .navmenu li { float: left; white-space: nowrap; margin: 0px; padding: 0px; display: inline}

#navmenubar .navmenu li a { background: url(http://p1.mb5u.com/texiao/1/navmenutabbg1.gif) no-repeat 0 0; width: 80px; padding: 7px 2px 5px 0; float: left; line-height: 20px; height: 20px; text-align: center}

#navmenubar .navmenu li a:hover { background-position: 0 -32px; color: #602800; text-decoration: none; padding: 8px 2px 4px 0}

#navmenubar .navmenu .current a , #navmenubar .navmenu .current a:hover { background: url(http://p1.mb5u.com/texiao/1/navmenutabbg1.gif) no-repeat 0 -64px; font-weight: 600; color: #FFF; font-size: 14px; padding:7px 2px 5px 0}

#top #navpart .mrc {

margin-top: 0px;

margin-right: auto;

margin-bottom: 0px;

margin-left: auto;

width: 950px;

height:auto;

}

.clear { clear: both; display: block; font: 0px/0 sans-serif; height: 0px; overflow: hidden; }

• 源码首页
• 编程资源
• 高质量源码

• 春节晚会
• 最新电影
• 视频王国
• 娱乐资讯

欢迎您~