我已经详细阅读了IE在使用过滤器时禁用ClearType的问题,我希望我的结论是错误的。在应用过滤器之后,似乎无法重新打开ClearType(例如, 阴影 要么 Α)。是这样吗?
随着每一个 其他 浏览器支持 text-shadow
现在我真的希望能够使用它,重新回到IE上 Shadow
要么 DropShadow
必要时过滤。但是对文本应用任何过滤器会让它看起来很糟糕。
有没有办法在Internet Explorer中启用ClearType和过滤器?
一些来源:
我已经详细阅读了IE在使用过滤器时禁用ClearType的问题,我希望我的结论是错误的。在应用过滤器之后,似乎无法重新打开ClearType(例如, 阴影 要么 Α)。是这样吗?
随着每一个 其他 浏览器支持 text-shadow
现在我真的希望能够使用它,重新回到IE上 Shadow
要么 DropShadow
必要时过滤。但是对文本应用任何过滤器会让它看起来很糟糕。
有没有办法在Internet Explorer中启用ClearType和过滤器?
一些来源:
有没有办法在Internet Explorer中启用ClearType和过滤器?
不会。过滤器在Internet Explorer中支持ClearType之前,并且从未设计为使用部分透明度。您链接到的博客文章中的问题从未得到解决,并且随着最新浏览器中的CSS3改进,未来的过滤器黯淡无光。
您可以使用一些技巧来进行近似 text-shadow
但是,在Internet Explorer中。不同的方法涉及直接在下面定位元素的副本,包含相同的文本,但应用 模糊 要么 阴影 过滤器。
假设您正在适度应用阴影,例如应用于部分标题或照片标题,您可以将文本复制到两个单独的元素中,并将一个元素放在后面,使用过滤器模糊它:
<h1><span class=".shadow">Fear my shadow!</span><span>Fear my shadow</span></h1>
body { background-color: lightgreen; }
h1 {
color: white;
font-family: Helvetica,Arial,sans-serif;
font-weight: bold;
font-size: 1.2em;
text-shadow: #333 2px 2px 3px;
padding-bottom:2px;
}
.shadow { display: none; } /* For non-IE browsers */
.ie > h1 > span {
position: absolute;
color: white;
}
.ie > h1 > span.shadow {
display: inline-block;
zoom: 1;
color: #333;
filter: progid:DXImageTransform.Microsoft.Blur(pixelradius=2);
}
对于IE6,您需要省略直接后代选择器 >
。不过,它在IE 6中看起来并不那么好。
:before
和 attr()
到目前为止,最简单的方法是不需要JavaScript的方法,但仅适用于IE 8和IE 9,因为它依赖于 :before
伪类和CSS attr()
功能。确实需要 将CSS定位到特定版本的IE但是。
h1 {
color: white;
font-family: Helvetica,Arial,sans-serif;
font-weight: bold;
font-size: 1.2em;
text-shadow: #333 2px 2px 3px;
padding-bottom:2px;
}
.ie8and9 > h1 {
zoom: 1; /* make element have layout */
color: #333;
filter: progid:DXImageTransform.Microsoft.Blur(pixelradius=2);
}
.ie8and9 > h1:before {
position: absolute;
color: white;
content: attr(data-innertext);
}
该方法的分步指南位于 http://www.useragentman.com/blog/2011/04/23/css-blurred-text-shadow-in-ie-part-i/。
有没有办法在Internet Explorer中启用ClearType和过滤器?
不会。过滤器在Internet Explorer中支持ClearType之前,并且从未设计为使用部分透明度。您链接到的博客文章中的问题从未得到解决,并且随着最新浏览器中的CSS3改进,未来的过滤器黯淡无光。
您可以使用一些技巧来进行近似 text-shadow
但是,在Internet Explorer中。不同的方法涉及直接在下面定位元素的副本,包含相同的文本,但应用 模糊 要么 阴影 过滤器。
假设您正在适度应用阴影,例如应用于部分标题或照片标题,您可以将文本复制到两个单独的元素中,并将一个元素放在后面,使用过滤器模糊它:
<h1><span class=".shadow">Fear my shadow!</span><span>Fear my shadow</span></h1>
body { background-color: lightgreen; }
h1 {
color: white;
font-family: Helvetica,Arial,sans-serif;
font-weight: bold;
font-size: 1.2em;
text-shadow: #333 2px 2px 3px;
padding-bottom:2px;
}
.shadow { display: none; } /* For non-IE browsers */
.ie > h1 > span {
position: absolute;
color: white;
}
.ie > h1 > span.shadow {
display: inline-block;
zoom: 1;
color: #333;
filter: progid:DXImageTransform.Microsoft.Blur(pixelradius=2);
}
对于IE6,您需要省略直接后代选择器 >
。不过,它在IE 6中看起来并不那么好。
:before
和 attr()
到目前为止,最简单的方法是不需要JavaScript的方法,但仅适用于IE 8和IE 9,因为它依赖于 :before
伪类和CSS attr()
功能。确实需要 将CSS定位到特定版本的IE但是。
h1 {
color: white;
font-family: Helvetica,Arial,sans-serif;
font-weight: bold;
font-size: 1.2em;
text-shadow: #333 2px 2px 3px;
padding-bottom:2px;
}
.ie8and9 > h1 {
zoom: 1; /* make element have layout */
color: #333;
filter: progid:DXImageTransform.Microsoft.Blur(pixelradius=2);
}
.ie8and9 > h1:before {
position: absolute;
color: white;
content: attr(data-innertext);
}
该方法的分步指南位于 http://www.useragentman.com/blog/2011/04/23/css-blurred-text-shadow-in-ie-part-i/。