css - 没有顶盒阴影？

Question

你怎么能消除顶盒阴影。如果 CSS 已经内置了一些东西，那将是完美的，但很少有。

这是一个活生生的例子。

向下滚动到页面底部到页脚。我想消除伪底上的顶盒阴影。

谢谢

Answer 1

用这个：

#Background
{
-webkit-box-shadow: 0px 1px 30px rgba(0,0,0,.4);
-moz-box-shadow: 0px 1px 30px rgba(0,0,0,.4);
box-shadow: 0px 1px 30px rgba(0,0,0,.4);
}

Answer 2

将此 CSS 应用到您的#wrapper2

#wrapper2{border-radius: 0 0 12px 12px;
          -webkit-border-radius: 0 0 12px 12px;
          -moz-border-radius: 0 0 12px 12px;

}

这将解决您的设计问题，并通过包含一个带有 pseudobottom 类的 div 来提供您想要的相同输出。

此外，我也很想知道将 div 包含在 pseudobottom 类中的目的。只是为了解决设计还是它也会有内容？

Answer 3

习惯这个为顶部和底部阴影添加一个盒子阴影

*像这样*

    .container-wide{
    -webkit-box-shadow: 1px 1px 1px 1px #ccc, -1px -1px 1px 1px #ccc;
    -moz-box-shadow: 1px 1px 1px 1px #ccc, -1px -1px 1px 1px #ccc;
    box-shadow: 1px 1px 1px 1px #ccc, -1px -1px 1px 1px #ccc;
    }

如果你只显示顶部阴影而不是应用这个 css

.container-wide{
-moz-box-shadow: -1px -1px 1px 1px #ccc;
-webkit-box-shadow: -1px -1px 1px 1px #ccc;
box-shadow: -1px -1px 1px 1px #ccc;
}