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

前端之家收集整理的这篇文章主要介绍了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;
}

它是固定的!喜欢魔法!

原文链接:https://www.f2er.com/css/221814.html

猜你在找的CSS相关文章