问题标签 [box-shadow]

多行文本位于图像上。文本应出现在白色背景上，如胶带。文本的每一行都需要在左侧和右侧有一个小的填充。这可以通过内嵌文本的框阴影来实现。

不幸的是，firefox 的结果与 chrome 不同。但我不能声称 Firefox 的行为是不正确的。但是我怎样才能为 Firefox 实现 chrome 结果呢？

相邻元素通常看起来好像它们是融合在一起的，它们之间没有线条或接缝）。示例：http: //jsfiddle.net/4m3L79w4/1/

但是，如果使用阴影，情况似乎不再如此。

html:

CSS：

“底部”元素在“顶部”元素上投射阴影，即使两者具有相同的 z-index。

JSFiddle：https ://jsfiddle.net/b4fvb7e0/1/

是不是可以让两个元素之间的阴影消失，让look融合呢？

这实际上是我正在尝试创建的标题的简化版本，在某些页面中应该与下一个元素融合在一起。JSFiddle 带有独立的标题和以下元素：http: //jsfiddle.net/c8oat7vo/3/

我有一件我想要的东西，但我找不到方法让我很恼火。

现在是这样的：

我希望红线是绿色的：

2 个相同的文本使用此 HTML：

我找不到更好的粘贴方法。不要介意 HTML 代码第一行中的“点”。

这是我目前使用的 CSS：

我希望你能明白我想说什么。我不使用 javascript 或 php。我只使用 HTML 和 CSS。能解释一下CSS代码的作用吗？

如果你看不到这个问题，那么请尝试看看这个codepen，在这里你应该明白我的意思。

我尝试了几种方法来修复它。在下面的评论中，您可以看到其中之一。仍然它似乎在适当的边框和阴影之间呈现 1px 崎岖的边框。

如果它取决于浏览器渲染器，那么它是一个错误吗？如何为所有现代浏览器正确修复它。

编辑：也试过这种方式，但没有积极的结果：

我刚刚遇到了盒子阴影的问题。

1. 有没有优先级box-shadow？

例如：

和

我看到很多像第二个这样的设置，为什么总是“moz->webkit->basic setting”？

2. 为什么我们需要-moz-box-shadow并且-webkit-box-shadow即使我们有 box-shadow？

I'm making the css tabs with shadows. How can I get rid of the bottom shadow in label? Here's an example: http://codepen.io/ekscentrysytet/pen/QbNdEB

I've tried z-index: -1; for label:after but shadow disappears.

在最新的 Material Design 文档 ( https://www.google.com/design/spec/what-is-material/elevation-shadows.html#elevation-shadows-elevation-android- ) 中引用了一组详尽的 UI 元素以及它们各自的高度（dp 中的 z-index）。例如，开关提升1dp，而对话框提升24dp。目前，Google 的 UI 元素列表使用 10 种不同的海拔高度。由于高程决定了元素的阴影，我们需要 10 个不同的阴影。这就是我迷路的地方。

您如何计算/推断每个高程级别的正确阴影值（颜色、x 偏移、y 偏移、模糊、散布）？

我发现不同的来源计算了 5 个不同高度的阴影值（https://news.layervault.com/stories/42319-calculating-shadow-values-for-material-design）。然而，5 个海拔台阶是不够的，它们也没有解释它们是如何达到这些各自的值的。

我想要一系列没有边距的 div 以及顶部和底部的盒子阴影，这样每个 div 的盒子阴影不会与任何其他 div 重叠。我已经构建了一个jsfiddle来展示我正在努力实现的目标以及我现在拥有的东西。这似乎z-index可以用于，但我不知道如何。

我的页面上有一个滑块来更改框​​阴影值。在某些高模糊值下，会出现一个不需要的盒子状的阴影，而它本来应该是一个平滑的阴影。有没有办法轻松避免这种情况？谢谢您的帮助。PS我实际上也需要它与“插图”一起使用。

不知何故，我觉得这很奇怪，我自己无法解决。

我有一个大开头的表格，它与父容器的box-shadow顶部内部（插图）重叠。box-shadow我需要让父母的黑色嵌入阴影可见。

看到这个小提琴

z-index什么也没做。

我的 CSS：

孩子的先验怎么来的？