A simple example of DIV CSS sliding door technology_Experience exchange

Author: zishu
The following is a navigation bar used on the KeQiji website.

What I wrote this time is not directly controlled in the form of ID in STYLE. All uses the CLASS form. ;

##Copy code The code is as follows:

The following is the BODY part: ##

#Copy code The code is as follows:

  兼职实习
  车辆买卖
  同城活动
  房屋租售
  同城寻缘
  跳蚤市场
  个人服务
  学习与培训培训

效果展示:

<meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>zishu.cn</title> <style type="text/css"> #zishu li{ float:left; margin-left:5px; margin-top:50px;} .nav_a a:link,.nav_a a:visited{text-decoration:none; display:block; padding-right:10px; background:url(/upload/20073614410846.gif) no-repeat right top;margin-top:3px; color:#000; float:left;} .nav_a span{cursor:hand;background-color: #DBF0C4; font-size:14px;background:url(/upload/20073614414862.gif) no-repeat; display:block; line-height:29px; padding-left:10px; cursor:hand; float:left;} .nav_a a:hover,.nav_a active{text-decoration:none; display:block; padding-right:10px; background:url(/upload/20073614410846.gif) no-repeat right bottom;margin-top:0px; color:#000} .nav_a a:hover span,.nav_a a:active span{background-color: #DBF0C4; font-size:14px;background: url(/upload/20073614414862.gif) no-repeat left bottom; display:block; line-height:29px; padding-left:10px; margin-top:0px; padding-top:1px; padding-bottom:2px; cursor:hand;} #box{ background:#009900; height:4px; overflow:hidden; clear:both} </style> <ul id="zishu"> <li class="nav_a"><a href="http://fenlei.zishu.cn/l.php?c=2104&a=21"><span></span></a></li> </ul>