当我们只给元素设置了border-top,没有设置其他边框的时候,如果我们使用了border-radius会出现虚边的情况,如下所示:

css代码:

div{width:100px; height:100px; border-top:2px solid #000; border-radius:50%; }

效果图如下:

border出现虚边问题解决_持续更新

很明显我们可以看到两侧的虚边,这是我们不想要的,解决办法很简单:只需要给其他的边框也都设置上,并且设置边框颜色为透明即可(当然要放在我们设置的border-top前面哦)如下所示

div{width:100px; height:100px;border:2px solid transparent; border-top:2px solid #000; border-radius:50%; }

效果图如下:

border出现虚边问题解决_css_02

ok,就是这么简单

前段时间因为有事比较忙,所以没有更新博客,以后如果没有特殊情况还是会持续更新的,每天进步一点点,加油