css中空圆圈 |css3 翻书动画效果

circle {
border: 2px solid  #333;
border-radius: 50%;
width: 20px;
height: 20px;
}

在上述代码中，大家定义了一个类名为“circle”的样式，其中 border 的样式为 solid、宽度为 2px，颜色为 #333，让它成为一个空心圆圈的边框。同时，大家使用 border-radius 将圆角属性设置为 50% ，使它成为一个圆形。在 width 和 height 属性中定义了圆的大小。

此外，大家还可以通过设置 background-color 的属性来添加填充颜色。以下代码示例可以创建一个具有背景颜色的圆圈：

circle {
border: 2px solid  #333;
border-radius: 50%;
width: 20px;
height: 20px;
background-color: #fff;
}

在上面的示例代码中，大家添加了一个背景颜色属性 background-color，并将其设置为 #fff。通过这种方式，大家可以创建出一个空心圆圈，并加上填充颜色，从而实现大家想要的效果。

总之，空圆圈是一种非常有用的样式，它可以帮助大家在网页中快速、简单地实现想要的效果。使用 CSS，大家可以轻松地创建漂亮的空心圆圈，并自由地设置其样式，同时将其应用于大家网页中的各种元素。