css - 文本模糊的最佳解决方案 + 所有浏览器支持 - 后备想法？

Question

我需要你的建议。

对于电子书网上商店，我需要显示部分文本和部分“伪”模糊文本: 这是我所做的不同测试的示例链接: http://dokumente-online.com/test-blur.html

这应该仅用作效果，因此后面的文本应该具有真实文本的结构(字体大小、章节)，但实际上它只是“lorem ipsum”或其他任何内容。它应该只告诉客户“还有更多，看起来像这样”

第一个想法是:模糊图像。 缺点:它始终是相同的图片，如果文本格式大不相同，则可能会产生误导。

通过 CSS3，我可以使用这种在大多数现代浏览器上运行良好的模糊效果:

`color: rgba(94,94,94,0);
  text-shadow: 0 0 11px rgba(50,50,50, .7);`    

目前在 chrome、firefox、safari 和 opera 上工作。

但是我能用通常令人紧张的 Internet Explorer 做什么呢？ 不支持文本阴影，即使在 IE10 上也不支持 RGBa()。

目前我使用 browsershot.org 进行测试，它让我感到困惑: http://browsershots.org/http://dokumente-online.com/test-blur.html 看起来在 IE8 和 IE9 上没有任何模糊效果起作用，而在 IE10 上甚至 RGBa(第一个版本)应该可以正常工作。但它不适用于我的 Windows 7 系统(也许在 Windows 8 上可以？？)。 我看到 filter:blur 可能在 IE8 和 IE9 中工作(但我只能在 IE10 版本中测试它)

你遇到过类似的问题吗？使用完全不同的解决方案？

即使没有 javascript，它也必须工作，所以如果我使用 jquery 插件，我需要先解决一些问题(javascript 首先设置为黑色的白色文本颜色)

Answer 1

use filter 过滤器接受颜色、方向和强度三个参数。方向取 Angular ，近似2px X和2px Y偏移，方向135度(135度是90度加45度)，强度选择2

  filter: progid:DXImageTransform.Microsoft.Shadow(direction=135,strength=2,color=ff0000);