1

我发现了一篇关于在 IE 中创建文本阴影的 Stackoverflow 文章：StackQuestion 现在我尝试了所有的“过滤器”解决方案，在 IE9 中，文本呈现出可怕的效果（尽管阴影阴影显示，文本像素化严重......）。

有谁知道 IE 的正确文本阴影技术？即使它只是为IE9 ...

谢谢你

4

3 回答 3

3

看看这个网站：http ://css3pie.com/

这是一个插件，可以让你在 IE6-9 中使用 CSS3

于 2012-07-27T13:44:58.670 回答
1

您可以在 Internet Explorer 中获得文本阴影效果，驯服 IE 的粗糙过滤器阴影效果，强制它们看起来不错并停止对文本进行像素化。使用 IE 色度过滤器：

  • 设置与阴影颜色接近但不相同的背景颜色 - 例如黑色阴影，深灰色，白色发光，浅灰色
  • （在仅 IE 的类或条件注释内的样式表或样式规则中设置背景颜色，以免在其他所有浏览器中破坏您的设计！）
  • 在您的 IE 过滤器 CSS 规则之前，将色度过滤器设置为与背景填充相同的颜色
  • 它看起来（几乎）相当不错！

jsfiddle 示例（在 IE8、IE9 中加载）

...或者，如果您无法轻松访问 IE8/9，这里是 IE9 IE8 模式下那个小提琴的屏幕截图。请注意 IE 默认过滤器的可怕、伪影、像素化混乱与相当清晰、外观正常的 Chroma 过滤器等效物之间的区别。

在此处输入图像描述

CSS 代码示例。注意你是如何得到一个 Chroma 过滤器，然后是另一个过滤器，都在一行上，用引号对一个-ms-filter- 以及 Chroma 颜色如何与背景颜色精确匹配，以及 Chroma 颜色如何赞美（但不匹配）主要效果颜色：

.chroma-glow {
    background-color: #dfdfdf;
    -ms-filter: "progid:DXImageTransform.Microsoft.Chroma(Color=#dfdfdf)progid:DXImageTransform.Microsoft.Glow(color=ffffff,strength=4)";
}
.chroma-shadow {
    background-color: #dfdfdf;
    -ms-filter: "progid:DXImageTransform.Microsoft.Chroma(Color=#dfdfdf)progid:DXImageTransform.Microsoft.Shadow(direction=135,strength=2,color=ffffff)";
}

一些要求（艰难地学习......）

  • 元素必须是blockor inline-block，不能是inline。
  • 过滤器无法应用于任何属于position: relative;或position: absolute;
    • （如果直接应用于position: absolute;or `position: relative; 元素，它们会起作用）
  • 如果您要动态添加过滤器，例如使用 jQuery like $elem.css('filter','progid...');，则似乎必须将背景颜色直接应用于具有过滤器的元素才能使色度起作用。几个提示：
    • 具有相同的效果颜色、应用的背景颜色和色度颜色
    • 由于您只需要在 IE 中使用此背景颜色，因此请使用特征检测或 IE 检测。
于 2012-12-18T02:36:26.370 回答
0 
#element {  
    filter: glow(color=black,strength=5);  
}
于 2012-07-27T13:56:49.960 回答