当前位置：首页 → 问答吧 → 如何去掉中间的那一竖,调了好久调不出来(仿58同城)

如何去掉中间的那一竖,调了好久调不出来(仿58同城)

时间：2010-05-06

来源：互联网

如何去掉中间的那一竖,调了好久调不出来(仿58同城)
让一二级连通

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <style type="text/css"> .my_left_category .my_left_cat_list{ width:430px; } .my_left_category .my_left_cat_listd{ width:430px; border-color:#959595; border-style:solid; border-width:1px 0px 1px 1px; } .my_left_category .h3_cat{ width:204px; position:absolute; left:155px; margin-top:-32px; cursor:auto; } .my_left_category .shadow_border{ position:inherit; width:300px; border:1px solid #959595; margin-top:0px; padding:5px 0px 0px 0px; display:none; font-size:48px; background-color:#ffffff; } .my_left_category .shadow_border ul{margin:0; padding:0; padding-top:10; margin-left:15px;margin-right:15px;} .my_left_category .shadow_border ul li { float:left; width:120px; height:30px; font-size:12px; overflow:hidden; letter-spacing:0px; } .my_left_category .sbfont { font-size:16px; } .my_left_category a{ text-decoration:none; color:#333333; } .my_left_category a:hover{ text-decoration:underline; color:#ff3333; } .my_left_category h3{ margin:0px; padding:0px; height:30px; padding-left:8px; } .my_left_category h3 a{ line-height:30px;} </style> <script language="javascript"> function display(num){ for(var id = 0;id<=1;id++) { if(id==num) { document.getElementById("shadow_border"+id).style.display="block"; document.getElementById("titleborder"+id).className="my_left_cat_listd"; } else { document.getElementById("shadow_border"+id).style.display="none"; document.getElementById("titleborder"+id).className="my_left_cat_list"; } } } </script> <body> <div class="my_left_category"> <h3 onMouseOver="javascript:display(0)" id="titleborder0" class="my_left_cat_list"><a href="#">房屋</a></h3> <div class="h3_cat"> <div class="shadow_border" id="shadow_border0" > <ul> <li><a href="#" class="sbfont">房屋出租</a></li> <li><a href="#" class="sbfont">房屋轉讓</a></li> <li><a href="#" class="sbfont">房屋出租</a></li> <li><a href="#" class="sbfont">房屋轉讓</a></li> </ul> </div> </div> <h3 onMouseOver="javascript:display(1)" id="titleborder1" class="my_left_cat_list"><a href="#">汽車</a></h3> <div class="h3_cat"> <div class="shadow_border" id="shadow_border1" > <ul> <li><a href="#" class="sbfont" >汽車出租</a></li> <li><a href="#" class="sbfont">汽車轉讓</a></li> </ul> </div> </div> </div> </body> </html>
提示：您可以先修改部分代码再运行

[ 本帖最后由 sevenu 于 2010-5-6 11:01 编辑 ]

作者: sevenu 发布时间: 2010-05-06

width:430px;
border-color:#ffffff;
border-style:solid;
把border-color 后面的颜色换一下就行了，

作者: faleshi 发布时间: 2010-05-06

引用:

原帖由 faleshi 于 2010-5-6 10:59 发表
width:430px;
border-color:#ffffff;
border-style:solid;
把border-color 后面的颜色换一下就行了，

我改了,加了一行,恐怕现在不行吧

作者: sevenu 发布时间: 2010-05-06

border-color:#ffffff;
换成这个颜色，换成其它的颜色肯定会有竖条的，要么你就把
border-style:solid;
border-width:1px 0px 1px 1px;
这个给去掉就行了，这样就没有边框了

作者: faleshi 发布时间: 2010-05-06

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <style type="text/css"> .my_left_category .my_left_cat_list{ width:430px; } .my_left_category .my_left_cat_listd{ width:139px; border-color:#959595; border-style:solid; border-width:1px 0px 1px 1px; position:relative; z-index:2; background:#FFF; } .my_left_category .h3_cat{ width:204px; position:absolute; left:155px; margin-top:-32px; cursor:auto; } .my_left_category .shadow_border{ position:inherit; width:300px; border:1px solid #959595; margin-top:0px; padding:5px 0px 0px 0px; display:none; font-size:48px; background-color:#ffffff; } .my_left_category .shadow_border ul{margin:0; padding:0; padding-top:10; margin-left:15px;margin-right:15px;} .my_left_category .shadow_border ul li { float:left; width:120px; height:30px; font-size:12px; overflow:hidden; letter-spacing:0px; } .my_left_category .sbfont { font-size:16px; } .my_left_category a{ text-decoration:none; color:#333333; } .my_left_category a:hover{ text-decoration:underline; color:#ff3333; } .my_left_category h3{ margin:0px; padding:0px; height:30px; padding-left:8px; } .my_left_category h3 a{ line-height:30px;} </style> <script language="javascript"> function display(num){ for(var id = 0;id<=1;id++) { if(id==num) { document.getElementById("shadow_border"+id).style.display="block"; document.getElementById("titleborder"+id).className="my_left_cat_listd"; } else { document.getElementById("shadow_border"+id).style.display="none"; document.getElementById("titleborder"+id).className="my_left_cat_list"; } } } </script> <body> <div class="my_left_category"> <h3 onMouseOver="javascript:display(0)" id="titleborder0" class="my_left_cat_list"><a href="#">房屋</a></h3> <div class="h3_cat"> <div class="shadow_border" id="shadow_border0" > <ul> <li><a href="#" class="sbfont">房屋出租</a></li> <li><a href="#" class="sbfont">房屋轉讓</a></li> <li><a href="#" class="sbfont">房屋出租</a></li> <li><a href="#" class="sbfont">房屋轉讓</a></li> </ul> </div> </div> <h3 onMouseOver="javascript:display(1)" id="titleborder1" class="my_left_cat_list"><a href="#">汽車</a></h3> <div class="h3_cat"> <div class="shadow_border" id="shadow_border1" > <ul> <li><a href="#" class="sbfont" >汽車出租</a></li> <li><a href="#" class="sbfont">汽車轉讓</a></li> </ul> </div> </div> </div> </body> </html>
提示：您可以先修改部分代码再运行

作者: redky 发布时间: 2010-05-06

十分感谢 redky ,结帖

作者: sevenu 发布时间: 2010-05-06