陰影/亮度

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尊重border-radius屬性的屬性。

像這樣的事情jsFiddle

box-shadow: 0 0 1em #FFD800; 

Answer 2

嘗試box-shadow屬性：

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

jsFiddle example

Answer 3

box-shadow是你想要的。添加到您的.circle類：

box-shadow: 0 0 30px #FFE8AE; 

有關各種屬性的更多詳情，請參閱https://developer.mozilla.org/en-US/docs/Web/CSS/box-shadow。