用css进行导航定位

简单利用CSS进行导航定位。这是我使用最方便的了。一直没找着好的方法。

<style>
#menu{
 clear:both;
 width:100%; height:64px;
 background:url(images/menu_bg.jpg) repeat-x;
}
#menu-bg{
 width:755px; margin:auto; height:64px;
 padding-left:124px; padding-right:124px;
 background:url(images/menu_bg.jpg) repeat-x;
}
#menu-parent{
 margin:auto; height:36px; line-height:36px;
 background:url(images/menu-parent-bg.gif) no-repeat left center;
}
#menu-parent a{
 display:inline; width:93px; height:36px; line-height:35px;
 float:left; text-align:center; padding-left:1px;
 color:#FFFFFF;
}
#menu-parent a:hover,#menu-parent a:active,.menuA{
 background:url(images/menu-bg-A.gif) no-repeat right;
 color:#CCCCCC !important;
}
</style>

 

<div id="menu">
  <div id="menu-bg">
  <div id="menu-parent">
  <a href="#" class="menu-this" id="par1">网站首页</a>
  <a href="#" id="par2">关于我们</a>
  <a href="#" id="par3">新闻中心</a>
  <a href="#" id="par4">产品体系</a>
  <a href="#" id="par5">解决方案</a>
  <a href="#" id="par6">典型案例</a>
  <a href="#" id="par7">客户服务</a>
  <a href="#" id="par8">联系我们</a>  </div> 
 
  </div>
</div>

/Files/sojay/CSS.rar

转载于:https://www.cnblogs.com/sojay/archive/2009/02/07/1385967.html