html - CSS 图像周围的阴影/亮度

Question

我有一个使用 CSS 创建的圆圈，如下所示:

.circle {
    width: 40px;
    height: 40px;
    -moz-border-radius: 50px;
    -webkit-border-radius: 50px;
    border-radius: 50px;
    text-align: center;
    margin-left:auto;
    margin-right:auto;
    color: #555555;
    line-height: 40px;
    font-weight: bold;
    border: 4px solid #333;
}

如何使用 CSS 在这个圆圈周围创建阴影/亮度，如下面的示例图片所示？

提前致谢!

Answer 1

box-shadow 就是你想要的。将此添加到您的 .circle 类:

box-shadow: 0 0 30px #FFE8AE;

参见 https://developer.mozilla.org/en-US/docs/Web/CSS/box-shadow有关各种属性的更多详细信息。