这两个绿色的div框 怎么让他去掉他们公用的那一小块边框。
62,074
社区成员
发帖
与我相关
我的任务
分享请发表友善的回复…
发表回复
邻家有女初长成 2014-01-21
- 打赏
- 举报
代码我试过了。。就是我要的 谢谢~~
小猪八Q 2014-01-18
- 打赏
- 举报
设置左边的border-right的颜色为背景色，不行在适当调整宽度，基本上就是将右侧的重合部分覆盖住
人生难得一只鸡 2014-01-18
- 打赏
- 举报
你想的太简单了。
wangyuping_2007 2014-01-18
- 打赏
- 举报
你分别把那两个DIV的 border-right border-left去掉不就行了
wangyuping_2007 2014-01-18
- 打赏
- 举报
晕你不会把左框的border-right 右框的border-left 都去掉不就行了
黑手党维多 2014-01-18
- 打赏
- 举报
楼主直接用jquery ui算了，这个有菜单滑动的，然后看看api什么的，或者找找相关资料，而且jqueryui也有css，都是现成的
huaneramn 2014-01-18
- 打赏
- 举报
哦。。。。。。。。。。。。。。。。。。。。
人生难得一只鸡 2014-01-18
- 打赏
- 举报
示例
<!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>
<style>
ul {
list-style: none;
border-bottom: solid 1px #ccc;
width: 100px;
padding: 0;
margin: 100px auto;
}
li {
width: 100px;
font-size: 14px;
text-align: center;
height: 30px;
line-height: 30px;
position: relative;
}
li a{width:98px;height:28;position:absolute;left:0;top:0;z-index:1;border: solid 1px #ccc;
border-bottom: none; text-decoration:none;}
li a.hover{border-right-color:#fff;}
.content {
border: solid 1px #ccc;
width: 200px;
height: 200px;
text-align: center;
display: none;
position: absolute;
left: 99px;
top: -85px;
}
</style>
<script>
window.onload=function()
{
var oUl=document.getElementById("nav");
var aLink=oUl.getElementsByTagName('a');
var aDiv=oUl.getElementsByTagName('div');
for(var i=0;i<aLink.length;i++)
{
aLink[i].index=i;
aLink[i].onmouseover=function()
{
this.className='hover';
aDiv[this.index].style.display='block';
}
aLink[i].onmouseout=function()
{
this.className='';
aDiv[this.index].style.display='none';
}
}
}
</script>
</head>
<body>
<ul id="nav">
<li> <a href="javascript:;">菜单1</a>
<div class="content"> 内容1 </div>
</li>
<li> <a href="javascript:;">菜单2</a>
<div class="content"> 内容2 </div>
</li>
<li> <a href="javascript:;">菜单3</a>
<div class="content"> 内容3 </div>
</li>
<li> <a href="javascript:;">菜单4</a>
<div class="content"> 内容4 </div>
</li>
</ul>
</body>
</html>
邻家有女初长成 2014-01-18
- 打赏
- 举报
不是的。。我的是用ul li 右边的div 用的是dl dt dd
邻家有女初长成 2014-01-18
- 打赏
- 举报
这不是行了么，右边已经是一条线了[/quote]要重复的地方没有边框线。。要这种的。。
我本良人 2014-01-18
- 打赏
- 举报
这个和td是一样的吧，
<table>
<tr>
<td style="width:200px;height:30px; border:1px solid Gray">
</td>
<td style="width:200px;height:30px; border-top:1px solid Gray; border-bottom:1px solid Gray; border-right:1px solid Gray">
</td>
</tr>
</table>黑手党维多 2014-01-18
- 打赏
- 举报
这不是行了么，右边已经是一条线了
邻家有女初长成 2014-01-18
- 打赏
- 举报
不行啊 左侧的div的右边框去掉了。可是右边的div的左边框在啊。。
冰川711 2014-01-18
- 打赏
- 举报
左侧这个 菜单的 border-right:0px
