Question

如何用css，js实现如图效果

div边框是怎么去除一部分的..

Answer 1

左右2个div

position:absolute;

左边保留上下左3个边，右侧保留上下左右4个边

左面z-index大于右边，让左面div压过右面div，压过的宽度正好是边框宽即可，简单示例

.left{
    position:absolute;
    left:0;
    top:0;
    width:100px;
    height:100px;
    border:1px solid #CCC;
    border-right:none;
    z-index:2;
}
.right{
    position:absolute;
    left:100px;
    top:0;
    width:200px;
    height:150px;
    border:1px solid #CCC;
    z-index:1;
}

<div style="position:relative">
    <div class="left"></div>
    <div class="right"></div>
</div>

追问

没有效果....

追答

.left{
    background:#FFF;
}

left加上背景色就行了

Answer 2

可也分别设置border-top border-right border-left border-bottom四个个属性，从而控制每一边的显示情况。