border出现虚边问题解决

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

css代码：

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

效果图如下：

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

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

效果图如下：

ok，就是这么简单

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