相关疑难解决方法(0)

我正在使用专有的MS'filter'属性来尝试创建一个非丑陋的等同于css3 text-shadow和box-shadow;

在我遇到这个问题之前,我确实做得非常好.看起来当我将一个过滤器应用于另一个div中的div时,该div也有一个过滤器,过滤器效果最终被组合在子对象上.

我无法解释它比这更好,这是一个演示:http: //cableflow.dev.arc.net.au/test/filters.html

我尝试过使用filter:none; 做重置但没有快乐.我也尝试了不同的语法变体,即"-ms-filter:'progid:... Glow()'","filter:progid:... Glow()","filter:Glow()"等等..

在IE8中测试

我试图在包含一些文本的div中使用CSS渐变.使用Gecko和Webkit,文本显示正常.在IE7和IE8中,文本显示为别名(锯齿状).

我看到这篇博客说:"我们决定在使用任何DXTransform的元素上禁用ClearType".

IE博客:http: //blogs.msdn.com/ie/archive/2006/08/31/730887.aspx

那是在2006年; 3.5年后,我认为这个bug会被修复,但事实并非如此.有没有办法在IE8中执行此操作而不需要在div中填充重复的背景图像？

这是我的意思的一个例子.

<style>
    div
    {    height:     50px; 
         background: -moz-linear-gradient(top, #fff, #ddd);
         background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#ddd));
         filter:     progid:DXImageTransform.Microsoft.gradient(startColorstr=#ffffffff, endColorstr=#ffdddddd);
    }
</style>

<div>Hello World</div>
<p>Normal text</p>

在IE中,div中的文本是别名(锯齿状),而段落中的文本不是.

任何不涉及图像的解决方案都将非常感激.

我正在使用fontello字体图标。它们可以与Internet Explorer完美配合。它们也不会对悬停状态做出反应，因此...此时，我遇到的问题是字体图标下的下划线。

我已经尝试过文字装饰，底线...

有人对此有任何解决方案吗？

这是我的CSS代码，我在此项目中使用SASS：

nav{

        a{
            width: 60px;
            height: $height-header-nav-tablet;
            float: left;
            line-height: 50px;
            text-align: center;

            @media screen and (min-width : $media-tablet-min) and (max-width : $media-tablet-max) {
                width: $width-header-link-nav-tablet;
            }

            i.icon-menu{
                font-size: 30px;
            }

                &:link,
                &:visited{
                    color: $blue-dark-takeda;
                    @include border-gradient;
                    text-shadow: 1px 1px rgba(28, 42, 83, 0.2);
                }

                &:hover{
                    color: $white-takeda;
                    background-color: $blue-dark-takeda;
                    text-shadow: 1px 1px rgba(0, 0, 0, 0.2);
                }

                &:active{
                    @include background-image(radial-gradient(45px 45px, $blue-dark-takeda 25px, #111931 40px));
                }


                &.active {
                    color: $white-takeda;
                    background-color: $blue-dark-takeda;
                    text-shadow: 1px 1px …