0

我有一个使用 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 在这个圆圈周围创建阴影/亮度，如下面的示例图片所示？

在此处输入图像描述

提前致谢！

4

3 回答 3

2

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

box-shadow: 0 0 30px #FFE8AE;

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

于 2013-10-10T16:58:12.520 回答
1

您可以使用尊重边界半径属性的box-shadow属性。

像这样的jsFiddle

box-shadow: 0 0 1em #FFD800;
于 2013-10-10T16:57:53.287 回答
1

试试这个box-shadow属性：

box-shadow:0px 0px 10px 10px #faa;

jsFiddle 示例

于 2013-10-10T16:57:54.633 回答