用css画出一个圆圈，里面有个对号

"```markdown

用CSS画出一个圆圈，里面有个对号

在这个示例中，我们将使用HTML和CSS创建一个圆圈，并在圆圈内部绘制一个对号。我们将使用CSS的border-radius属性来绘制圆圈，并使用伪元素和CSS绘制对号。

HTML结构

首先，我们需要一个简单的HTML结构。我们将创建一个包含圆圈的div。

<div class=\"circle\">
    <div class=\"checkmark\"></div>
</div>

CSS样式

接下来，我们将添加CSS样式来创建圆圈和对号。

body {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
    background-color: #f0f0f0;
}

.circle {
    width: 100px; /* 圆圈的宽度 */
    height: 100px; /* 圆圈的高度 */
    background-color: #4CAF50; /* 圆圈的背景颜色 */
    border-radius: 50%; /* 设置圆角，使其成为圆圈 */
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative; /* 为伪元素定位 */
}

.checkmark {
    width: 40px; /* 对号的宽度 */
    height: 20px; /* 对号的高度 */
    border: solid white; /* 对号的颜色和样式 */
    border-width: 0 5px 5px 0; /* 设置对号的边框宽度 */
    position: absolute; /* 绝对定位 */
    transform: rotate(45deg); /* 旋转对号 */
    top: 30%; /* 控制对号的垂直位置 */
    left: 30%; /* 控制对号的水平位置 */
}

效果展示

将上述HTML和CSS代码放在一个HTML文件中，打开时可以看到一个绿色的圆圈，里面有一个白色的对号。这个效果非常简单，但展示了如何使用CSS绘制基本图形和图标。

注意事项

• 圆圈的大小可以通过调整.circle类中的width和height属性来更改。
• 对号的颜色和大小可以通过调整.checkmark类中的border和width、height属性进行修改。
• 通过transform属性可以旋转对号，以确保它正确显示为对号的形状。

通过以上步骤，可以轻松创建一个带有对号的圆圈，适用于多种Web界面设计需求。