看透/隐形白色文字阴影

我在DOM中有一个html元素;看透/隐形白色文字阴影

<h5 class="white-shadow"> Basic </h5>

它附加了以下css规则;

.white-shadow{ 
    text-shadow: -1px 0px 5px #ffffff; 
}

h5位于具有灰色背景的列表元素中。这个想法是为了更好的可读性添加白色文字阴影。奇怪的是我没有看到任何结果。

这就是我在浏览器中看到的;

html

这是devtools表明了我;

devtools

但是，如果我从白色改变背景颜色为红色，我能看到的变化。

这就是我在浏览器中看到的;

enter image description here

这是devtools表明了我;

enter image description here

我没碰过的文字阴影规则的阿尔法参数。出于某种原因，红色文字阴影颜色可见，而白色文字颜色不可见。

我正在使用bootstrap3，但我不认为它会阻止任何地方的白色文本阴影。

为什么我无法看到文字周围的白色阴影？我怎么修复它？

来源

2014-01-28 cantdutchthis

据工作：http://jsfiddle.net/6ZkHg/ – Amberlamps

工程 - http://jsfiddle.net/Y45Fk/1/，它只是六角差别并不多， cuz #eee和#fff不是太深和浅的阴影 –

同意：http://jsfiddle.net/t4cQy/这是bg和文本阴影颜色太接近或CSS特异性/覆盖问题。 –

阴影是有在DOM，但因为你的background-color的，它是没有多少明显的 see here

我的建议，要么改变shadow color或background-color

here is what you want

使用

.white-shadow{ 
    text-shadow: 2px 0 0 #fff, -2px 0 0 #fff, 0 2px 0 #fff, 0 -2px 0 #fff, 1px 1px #fff, -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff; 
}

从螺纹报价值：Text border using css (border around text)

来源

2014-01-28 11:04:47 NoobEditor

啊是的。通过重复css规则，它们将重叠并导致更多效果。好的解决方案 – cantdutchthis

看透/隐形白色文字阴影

回答

相关问题