如何让一个空的 div 或容器发出纯 CSS 的光？

Question

我想让一个空容器发光所以我使用这个代码：

box-shadow: 0 1px 20px 1px lightcyan;

问题是只有边框发光，中间有个大洞，不是我想要的效果。我知道我可以移动阴影的位置，这样它就不会被容器本身重叠，但我不想这样，因为它会不合适。

有没有其他方法可以用纯 CSS 实现这种效果？

类似这样的东西，但没有背景：

Answer 1

box-shadow 可以做到，只需提高模糊度和扩散度（第 3 和第 4 个参数）即可。

圆加border-radius: 50%;给小width和height.

div {
  margin: 100px;
  width: 1px;
  height: 1px;
  background-color: lime; /* for the 1px in the center */
  border-radius: 50%;
  box-shadow: 0 0 50px 70px lime;
}

<div></div>

如何让一个空的 div 或容器发出纯 CSS 的光？

How to make an empty div or container glow with pure CSS?

css

glow

box-shadow