Css - 阴影叠加其他元素

-2

我有几个div，每个都有一个阴影，但div的阴影总是覆盖下一个div。Css - 阴影叠加其他元素

这里是我的代码： HTML：

<div> 
Some Text 
</div> 
<div> 
Some Text 
</div> 
<div> 
Some Text 
</div> 
<div> 
Some Text 
</div> 
<div> 
Some Text 
</div>

CSS：

div { 
    background-color:white; 
    text-align:center; 
    box-shadow: 0 0 3px 5px black; 
}

小提琴：https://jsfiddle.net/81t4v4a5/

我要完成类似的东西，但没有一个容器：https://jsfiddle.net/kc98heaw/

就是这样可能？

来源

2016-08-15 Pachu

目前尚不清楚你想要达到的目的。当容器是盒子模型的重要组成部分时，为什么你不愿意使用容器？为什么每个文本行都在自己的div中，如果你只想要一个父div的样式？第二个小提琴是否链接了你想要的版本？ – leigero

第二个链接是我想要实现的，而不使用contaienr，因为如果所有的div都被包装在一个容器中，我想应用一些其他的行为，所以不能完成 – Pachu

这是你在找什么？

小提琴：https://jsfiddle.net/y6097xso/

我试图通过所有div迭代和绘制阴影与表达：

div { 
 
    background-color:white; 
 
    text-align:center; 
 
    box-shadow: 0 0 3px 5px black; 
 
} 
 
div:nth-child(2n){ 
 
    position: relative; 
 
    box-shadow: 9px 0 4px -4px black, -9px 0 4px -4px black; 
 
}

<div> 
 
Some Text 
 
</div> 
 
<div> 
 
Some Text 
 
</div> 
 
<div> 
 
Some Text 
 
</div> 
 
<div> 
 
Some Text 
 
</div> 
 
<div> 
 
Some Text 
 
</div>

来源

2016-08-15 18:13:12 AlliaS

几乎，它看起来不太对，第二个孩子，你能扩展你在那里做了什么吗？ – Pachu

是的，对不起，我在阴影中弄得一团糟，这个更好吗？ – AlliaS

https://jsfiddle.net/y6097xso/ – AlliaS

Css - 阴影叠加其他元素

回答

相关问题