融合具有透明背景和盒子阴影的重叠元素

Question

3

我正在尝试让两个元素对齐并融合，就像它们是一个元素一样。通常情况下，我会将它们部分重叠，它们很容易看起来像一个元素，但我使用的这两个元素都具有部分透明的背景，因此重叠看起来很奇怪——它会比其他背景更暗，并且您会清楚地看到框阴影。

我已经尝试完美地对齐我的元素，但是你仍然会看到一点阴影，我还尝试了在框阴影的扩散值上使用负数，但这并不理想，因为我只需要部分元素没有阴影，例如一侧的一半，而不是整个一侧...

我一直在四处寻找，但找不到任何东西，有人有想法吗？

编辑：

我对画布元素知之甚少，但是否有办法使用画布来做类似的事情，比如在画布上绘制复杂的形状，并将其置于内容下面？

- Thomas

1

将 .main div 放入一个带有 overflow: hidden 的 div 中可以隐藏 .main div 底部的阴影。但是，我担心无法隐藏 .bottom div 与 .main div 相交部分的顶部阴影。 - ExpExc

那是我的假设，谢谢。 - Thomas

2个回答

0

像这样的东西？

- ezakto

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Simone · Accepted Answer

我只是去掉了负边距和顶部阴影。这可能不完全符合您的要求，但是...希望您喜欢。