#### 1.html结构 <div class="parent"> <div></div> <div></div> <div></div> <div></div> </div> * * * * * 用伪类画边线 .parent{ width: 1000px; height: 400px; border-radius: 3px; border:1px solid #333; margin-left: auto; margin-right: auto; } .parent>div{ width: 25%; height: 100%; float: left; position: relative; } .parent>div:not(:last-child)::after{ content: ""; display: block; position: absolute; height: 100%; border-right:1px solid #333; top: 0; right: 0; } * * * * * 用margin-left：-1px； ~~~ .parent{ width: 1000px; height: 400px; border-radius: 3px; border:1px solid #333; margin-left: auto; margin-right: auto; } .parent>div{ width: 25%; height: 100%; float: left; border-left: 1px solid #333; margin-left: -1px; } ~~~