css3画圆点 |mdui css太大

/* 简单的CSS3画圆点样式 */
.dot {
width: 10px;
height: 10px;
border-radius: 50%;
background-color: red;
}

上述代码简单易懂，通过设置元素的宽度、高度和边框圆角，再设置背景颜色就可以轻松实现一个圆点。

如果想要画出多个圆点，可以通过CSS3的伪类技术来实现。下面是示例代码：

/* 用CSS3画出多个圆点 */
.dot-group {
display: flex;
}
.dot-group .dot {
width: 10px;
height: 10px;
margin-right: 5px;
border-radius: 50%;
background-color: red;
}
.dot-group .dot:last-child {
margin-right: 0;
}

上述代码中，大家使用了flex布局来让多个圆点横向排列，使用了伪类选择器:last-child来去除最后一个圆点的右边距，更好地呈现视觉效果。

CSS3画圆点非常方便，只需要简单的几行代码就可以实现。如果想要更复杂的效果，可以使用CSS3的渐变、动画等进阶技术，实现更加炫酷的效果。