没有顶盒阴影？答案

【问题标题】：No top box-shadow?没有顶盒阴影？
【发布时间】：2013-05-02 04:51:42
【问题描述】：

您如何消除顶盒阴影。如果 CSS 已经内置了一些东西，那就完美了，但很少有。

这是example的直播。

向下滚动到页面底部到页脚。我想消除pseudobottom上的top box-shadow。

谢谢

【问题讨论】：

标签： css

【解决方案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);
}

【讨论】：

【解决方案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 类中的目的。只是解决设计还是内容也有？

【讨论】：

我希望它是那么简单。该站点的设置方式是所有页面都继承页眉和页脚。因此，为了让它在整个站点范围内工作，我必须摆脱这个小麻烦；为了避免将来出现一些令人头疼的问题。
我访问了您的网站并看到了您的 HTML 结构。我建议添加一个带有 pseudobottom 类的 div 作为补丁来解决结构只会让事情变得不完整和复杂。例如，您可以检查 login.php 页面的外观。因此，让包装器 div 灵活地容纳任何类型的内容是合适的解决方案，而不是添加 hack 或补丁。
它是基于 PHPMotion 的，一开始就很糟糕，所以我基本上一直在破解整个事情。我修改了代码，它吃掉了一些页面的页脚。嗯。我基本上使用了您的代码，并尝试了其他因素以使其正常工作。不要自大:)

【解决方案3】：

习惯于为 top 和 bottom 添加一个 box shadow 阴影

*像这样*

    .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;
}

【讨论】：