[分享]css中怎么做空心圆

CSS的样式魔法不仅可以让我们制作各种图形效果，还可以制作出漂亮的空心圆。

.circle {
  width: 50px;
  height: 50px;
  border: 2px solid black;
  border-radius: 50%;
} 

上面的CSS代码中，我们新建了一个名称为.circle的类，定义了这个圆形的宽度、高度和边框。其中，border-radius属性可以让我们将这个方块的四个角变成圆角。而这里的border-radius值为50%是将这个方块的半径设置为它自身的一半，从而变成了一个圆形。

通过上面的代码，我们可以看到一个黑色的空心圆形。当然，你也可以根据需要再调整CSS属性值，改变圆形的样式和颜色。

总之，CSS让我们在网页设计中可以轻易呈现出多彩多姿的效果，空心圆就仅仅是其中的一种。大家可以通过不断尝试和改进，发掘更多好玩有趣的CSS样式。