不透明度低于1时具有奇怪阴影（模糊）的字体（仅限Chrome）

Question

我正在使用Bootstrap Tooltip Component，并注意到当不透明度低于1，仅在Chrome 时出现奇怪的文本行为。它显示了某种边界，可能是为了提高可读性，但在这种情况下，它更像是一个错误，而不是一个帮助。

重现问题:(在FireFox中很好，在Chrome中很糟糕）
fiddle

HTML代码

<p>
    First Paragraph
</p>
<p id='StrangeParagraph'>
    Second Paragraph
</p>

CSS代码

body{
    background-color:#000;
}
p{
    font: normal 11px Arial, Helvetica, sans-serif;
    color: #fff;
}
#StrangeParagraph{
    opacity: 0.9;
}

下面是一张显示详细问题的图片......

（我知道它似乎没问题，但是其他一些词，在我必须使用的其他习语中，它开始变得有点模糊，而且有点可读性。）

所以，我的问题不正是为什么......但是如何解决这个“鬼”渲染？

详细说明：
- Windows 7专业版x64
- Windows ClearType关闭
- 谷歌浏览器版本34.0.1847.116（最新）
- 视频卡nVidea GeForce GT540

（已经尝试过没有成功：
  文字阴影
  -webkit-字体平滑
  -webkit-文本冲程
  字体重量
  -webkit-背面能见度
  font-smooth（Chrome甚至不接受它））

Answer 1

首先，我要感谢@Tschitsch。他的评论是黑暗中的一盏灯。所以，谢谢！

最后，我仍然不知道其他用户是否没有目击或只是没有注意到这个问题。无论如何，我要感谢所有试图提供帮助的人。

现在，答案：

进行一些观察，我注意到它只发生在文本在DIV内部，其不透明度设置为低于1（100％）。当不透明度为1时，文本呈现得非常清晰（因此，我认为它不是正常的事情。它不像......这种字体在Chrome中以这种方式呈现，你无能为力）。 我还注意到文本中没有任何问题是半透明的。

因此，总而言之，问题只是来自div的文本对opacity属性的继承。

我的解决方案是直接在元素的颜色中使用不透明度，允许我使DIV半透明，而不对文本设置不透明度（但是你也可以在文本中使用rgba，没有任何颜色）问题）。

要特别解决Bootstrap工具提示组件（v 2.3.2） 中的问题，下面是我的代码。它使文本在Firefox 27，Chrome 34，IE 8中变得清晰（我仍然不相信这最后一个hahaaaha）

Css代码

.tooltip.in {
    opacity: 1;
}

.tooltip-inner {
    color: #FFFFFF;
    background-color: rgba(0,0,0,0.8);
}

.tooltip.top .tooltip-arrow {
    border-top-color: rgba(0,0,0,0.8);
}

我真的希望我也可以帮助那些解决这个问题的人。

（仍然不明白为什么会被投票......）