1

这是我在鼠标悬停时应用于图像标签的 css 类：

div#simpleSearch button#searchButton > img:hover {
    /* Box-shadow */
-moz-box-shadow: 0px 0px 13px #AFAFAF; 
     box-shadow: 0px 0px 13px #AFAFAF;

    /* Border-Radius */
-moz-border-radius: 100px; /* Firefox */
  -o-border-radius: 100px;
     border-radius: 100px; /* CSS3 */
}

它工作正常。但是，如果我替换#AFAFAF为whiteor #FFFFFF，则不会对我的图像应用边框。我应该补充一点，网站背景是灰色的，因此可以看到白色阴影。

正如任何人已经经历过的那样？任何解决方法建议都是最受欢迎的。

4

3 回答 3

1

尝试

-moz-box-shadow: 13px 13px 0px 0px #FFFFFF;
-webkit-box-shadow: 13px 13px 0px 0px #FFFFFF;
 box-shadow: 13px 13px 0px 0px  #FFFFFF;

最后 2 个值是可选的，如此处所示

于 2012-09-20T20:08:25.103 回答
1

box-shadow如果您需要在div元素上添加一些白色顶部和底部，例如，您可以在这里提出这样的解决方案：

div:after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  box-shadow: inset 0 60px 50px -30px #ffffff, inset 0px -60px 50px -30px #ffffff;
  z-index: 1;
}

不要忘记添加z-index。

于 2019-02-12T10:33:58.317 回答
0

我做了快速的jsfiddle，但将css简化为只使用一个ID，它工作正常，它在悬停时显示白色。

确保您的 CSS 真正应用于您的内容

http://jsfiddle.net/fc9dJ/17/

于 2012-09-20T20:23:38.510 回答