要想实现一个CSS小灯泡，首先需要一个div容器，然后使用CSS样式来设置容器的大小、背景颜色、边框、以及圆角。接着在容器内部创建一个小圆球，通过绝对定位和边框样式，实现小圆球和容器的分离并模拟出小灯泡的效果。最后，用代码实现小圆球在容器内部的闪烁效果。
.container {
width: 20px;
height: 30px;
background-color: #fff;
border: 1px solid #ccc;
border-radius: 50%;
position: relative;
}
.container::before {
content: '';
display: block;
width: 10px;
height: 10px;
background-color: #fcc;
border-radius: 50%;
position: absolute;
top: -5px;
left: 50%;
transform: translateX(-50%);
border: 2px solid #e00;
animation: blink 1s infinite;
}
@keyframes blink {
0% {
opacity: 1;
}
50% {
opacity: 0.5;
}
100% {
opacity: 1;
}
}在以上代码中，大家创建了一个类名为“container”的标签，并设置其样式属性。其中，样式属性“width”和“height”分别设置容器的宽度和高度；样式属性“background-color”设置容器的背景颜色；样式属性“border”定义容器的边框属性，后面的参数设置了边框的颜色和粗细；样式属性“border-radius”设置了容器的圆角。
接下来，大家使用“::before”伪元素，在容器内创建一个小球，通过“border-radius”属性设置圆角，用“top”和“left”属性分别调整小球的位置。最后，通过“animation”属性来生成小球闪烁的动画效果。
通过以上代码实现的CSS小灯泡，可以轻松地应用到网站的设计中，增添一份生动趣味的感觉。