问题标签 [box-shadow]

我有三个 div，想通过将外部（1px div）的阴影投射到更大的中间 div 中来“伪造”一个插图。

我不在乎我们是否使用 z-index（它们可以浮动），无论您认为是解决它的最佳方法。

为什么阴影不显示？

最终结果应该“看起来”像这样：

但是，我想要三个 div 的“假插图”解决方案。

如果你还是不明白。顶部和底部 div 应该将它们的阴影投射到中间 div 中，这样结果看起来就像中间 div 有两个嵌入的阴影。

我可以解释为什么我想这样做，但我宁愿让问题保持简单。

我在用

和

单击此处查看暂存站点

这不是在每个版本的 Internet Explorer 中都显示，包括 IE 11 Metro。我正在通过 browserstack.com 进行测试，并且无法访问 IE 的实际副本。谢谢！

更新： 最初的问题是解决我的 box-shadow css 没有在任何版本的 IE 中呈现的事实。

这个问题给了我线索

需要在页面的第一行。问题是我正在使用 Perch CMS，它需要在页面的第一行有一行 php。请参阅文档。现在的问题变成了：是否可以在使用 Perch CMS 的同时在 Internet Explorer 中渲染一个盒子阴影？

问题小提琴 1

这是有问题的小提琴：小提琴1

在这个特定的例子中，我使用了 100% 的左上边框半径，所有其他的边框半径都是 0%，并且高度等于宽度，产生一个象限。

现在我用 x,y 偏移向主元素添加了 3 个插入框阴影。我希望盒子阴影跟随曲线，并且彼此平行，如下所示：

这是输出：

问题小提琴 2

这是盒子阴影不跟随曲线的另一个例子。这个没有 xy 偏移。小提琴 2

在这种情况下，粉红色区域应该是一个象限，但看起来像一个三角形。

为什么随着传播半径的增加，插图框阴影会失去曲线？这是一个错误吗？它似乎不是一个，因为所有主要浏览器都提供相同的输出。

我有一个包含内框阴影的 div，但这些阴影被另一个 div 覆盖，我尝试使用 postion:relative 但没有任何改变。

这是一个示例 代码示例

提前致谢 ！

所以，我的网站有一个标题和一个包含革命滑块的 div。我正在尝试在标题下方和滑块上方添加一个框阴影。但它不起作用，除非我也添加margin-bottom到标题中 - 但这会使整个练习变得毫无意义。

这是代码：

有人可以帮我弄清楚是什么原因造成的吗？

我知道这可能是一个骗局，但我愿意接受打击，因为我有信心研究了多种解决方案。

我已经尝试了很多方法来让这个 box-shadow 过渡工作，包括：

• 在声明中切换 hex、rgb 和 rgba 颜色box-shadow。
• 使用更具体的选择器。
• 更改transition要包含ease-in-out在声明末尾的属性。
• transition我清除了可能影响元素的任何属性的 CSS 文件。
• 一直以来，三次检查我的拼写错误。

检查员说我的样式没有被覆盖。这是我的代码：

这里可能发生什么导致它什么都不做？

这是我的网站的链接，以获得上下文体验。它是页面右上角的标题菜单。

试图模拟一个不是从元素的左边缘开始的上边框。

上面的 css 很接近，但会在 div 的右侧产生一个 15px 宽的黑色阴影。我该如何控制它？

http://jsfiddle.net/3sjngyk1/

盒子阴影密码笔

我试图让具有相同 z 级别的元素在它们的盒子阴影中不相互重叠。在链接的示例中，所有内容的 z 级别为 2，但中间元素的框阴影与上部元素重叠。考虑到这两个元素在同一平面上，我会认为这不会发生。有什么建议么？

我正在使用一个函数在文本或 html 标记上生成渐变阴影。而且我不明白为什么阴影的角度不一样。

为了在 HTML 标记上获得相同的结果，我必须将阴影的 y 位置除以 2（您必须取消注释Codepen 示例中 SCSS（l.14-l.16）上的这 3 行才能看到结果）

看起来像

行评论

行未注释

所以我用这个地方来帮助我创建幻灯片，但是，由于 CSS 的某些限制，你不能将 box-shadow 属性设置为 IMG。

然而，问题是由于脚本的性质，一旦它通过 IMG 运行完成，它就会遇到 div。

脚本不应该遇到 div，因为 div 仅用于装饰（同样，因为 box-shadow 不能用于 IMG）。我希望有人能够帮助我格式化代码以忽略#slideshadow div。

HTML（用替换图片编辑，感谢 CSS，尺寸是必要的）：

CSS：

脚本：