微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

CSS3箱子阴影在顶部,左,右只

问候,

我试图应用CSS3框阴影只有一个DIV的顶部,右侧和左侧,半径匹配以下CSS的结果(减去底部阴影)

#div {
    -webkit-Box-shadow: 0px 0px 10px #000;
    -moz-Box-shadow: 0px 0px 10px #000;
    Box-shadow: 0px 0px 10px #000;
}

什么是最好的方法来完成这个?

谢谢!

更新
此阴影将应用于页面上的导航栏,该条位于主容器DIV的顶部。我想要完成的是继续主导DIV的框阴影到导航栏,它在它上面,但没有在导航栏上的底部阴影。看看site itself看看我在说什么,比添加所有的HTML和CSS更容易。

更新2
因为我工作的DIV是单数,而不是试图在每个导航li上放置阴影,我选择将其更改为以下:

-webkit-Box-shadow: 0px -4px 7px #e6e6e6;
    -moz-Box-shadow: 0px -4px 7px #e6e6e6;
    Box-shadow: 0px -4px 7px #e6e6e6;

这使得阴影的顶部非常明显,但这是我想要完成的 – 如果任何人都知道一个方法来保持阴影在容器DIV外观相同,请让我知道。谢谢!

解决方法

它是更好的,如果你只是覆盖底部与另一个div,你会得到一致的投影。
#servicesContainer {
  /*your css*/
  position: relative;
}

它是固定的!喜欢魔法!

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。