当前位置:编程学习 > html/css >>

用css、jquery做的选项卡效果,有一个小疑问,请高手指点,代码如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title> <script src="js/jquery-1.6.2.min.js"></script> <script type="text/javascript"> $(document).ready(function(){ $(".ct:gt(0)").hide(); var hdw=$(".box ul li"); hdw.click(function(){ $(this).addClass("one") .siblings().removeClass("one"); index=hdw.index(this); $(".ct").eq(index).show() .siblings().hide(); }); }); </script> <style type="text/css"> *{padding:0px; margin:0px;} body{font-size:12px; padding:100px;} ul{list-style-type:none;height:30px;line-height:30px;} .box ul li{float:left; position:relative; border:1px solid #000;margin-right:5px;padding:0px 5px;border-bottom:none;} .box ul li.one{background:#fff;} .content{width:325px; height:100px;border:1px solid #000;padding:10px;} </style> </head> <body> <div class="box"> <ul> <li >课程介绍</li> <li>报名流程</li> <li>常见问题</li> </ul> <div class="content"> <div class="ct">随着移动互联网的兴起,互联网行业正向更加智能化的Web3.0时代迈进,中国互联网行业进入了高速发展的势态,PHP语言已经为大部分企业广泛应用和重视(如:新浪、百度、腾讯、TOM、淘宝、搜狐、网易等)PHP语言是各大IT公司首选的互联网编程语言。PHP开发优势明显,未来发展空间巨大,IT行业急需PHP开发人才。 </div> <div class="ct">这里有后盾名学员对后盾网视频的评价,来后盾培训是你一生不悔的选择.用一个比喻来讲:后盾网实训课程不光是教你怎样开汽车,更是传授你如何制造汽车的技能.让学员自己能开发一个完整的框架产品,从深层次上掌握PHP的应用,这是后盾独有的。 </div> <div class="ct">PHP主讲老师具有多年项目开发经验及企业培训经验,打造企业需要的人才. 就业老师提供给学员职业素质、职业经验、职业技能等全方位就业指导。 </div> </div> </div> </body> </html> 鼠标点击的时候给<li>添加类之后,为什么设为白色背景后,下面content的border会消失?
CopyRight © 2012 站长网 编程知识问答 www.zzzyk.com All Rights Reserved
部份技术文章来自网络,