? <div class="nav">

?? <div class="nav_left"></div>
?? <div class="nav_mid">
???? <div class="nav_mid_left">
????? <ul>
?????? <li><a href="#">首頁</a></li>
?????? <li><a href="list.html">關(guān)于慕課</a></li>
?????? <li><a href="list.html">新聞動態(tài)</a></li>
?????? <li><a href="list.html">課程中心</a></li>
?????? <li><a href="list.html">在線課程</a></li>
?????? <li><a href="list.html">人才招聘</a></li>
????? </ul>
???? </div>
???? <div class="nav_mid_right">
????? <form action="" method="post">
?????? <input type="text" class="search_text"/>
????? </form>
???? </div>
?? </div><!--nav_mid結(jié)束-->
?? <div class="nav_right"></div>
? </div><!--nav結(jié)束-->
</div><!--wrop結(jié)束-->
</body>
</html>

css代碼

.nav{
?height:40px;
?}
?
.nav_left{
?width:10px;
?background:url(../image/nav_left.jpg) no-repeat;
?/*background-image:url(../image/nav_left.jpg);
?background-repeat:no-repeat;*/}
?
.nav_mid{
?width:980px;
?background:url(../image/nav_bg.jpg) repeat-x;
}
?
.nav_right{
?width:10px;
?background:url(../image/nav_right.jpg) no-repeat;
?float:left;}
?
.nav_left,.nav_mid,.nav_right{
?float:left;
?height:40px;}
?
.nav_mid_left,nav_mid_right{
?float:left;}
?
.nav_mid_left{
?width:680px;}
?
.nav_mid_right{
?width:300px;}
?
.nav_mid_left li{
?float:left;
?list-style:none;
?width:100px;
?text-align:center;
?line-height:40px;}
?
.nav_mid_left a:link,.nav_mid_left a:visited{
?text-decoration:none;
?color:#FFF;
?font-size:16px;
?font-family:Fixedsys, "Microsoft YaHei UI";}

.nav_mid_left a:hover,.nav_mid_left a:active{
?text-decoration:none;
?color:#FF0;
?font-size:16px;
?font-family:Fixedsys, "Microsoft YaHei UI";}
?
search_text{
?width:190px;
?height:25px;
?margin-top:5px;
?background:url(../image/search.jpg) no-repeat right center;
?}