Question

我无法在IE或Firefox中进行此转换，在Safari和Chrome中看起来很不错。不透明度显示但是是即时的对我来说，下面的CSS看起来是正确的，我看不出任何理由它可以在IE或Firefox中工作我已经尝试过使用-ms-transition并且它会产生相同的结果，但是网站仍然使用CSS3，所以不管怎样我都不需要-ms-。
任何可以脱落的灯都会非常感激！本

CSS：

.XMABAN {   
    height: 153px;  
    width: 230px;  
    background-color:rgb(127,0,25);  
    padding: 0;  
    vertical-align: top;  
}

.XMABAN a {  
    height: 153px;  
    width: 230px;  
    text-decoration:none;  
}

.XMABAN a:hover         {   
    text-decoration:none;   
}

.XMABAN img             {   
    opacity: 1;  
    transition: opacity 0.70s ease-in-out;   
    -moz-transition: opacity 0.70s ease-in-out;  
    -webkit-transition: opacity 0.70s ease-in-out; 
    -o-transition: opacity 0.70s ease-in-out; 
}

.XMABAN a:hover img     {   
    opacity: 0.30;  
    transition: opacity 0.25s ease-in-out;  
    -moz-transition: opacity 0.25s ease-in-out;  
    -webkit-transition: opacity 0.25s ease-in-out;  
    -o-transition: opacity 0.25s ease-in-out;  
}

.XMABAN span            {   
    position: relative;  
    left: 0%;  
    top: -62%;  
    font-weight:bold;  
    font-size:20pt;  
    color:#404040;  
    transition: color 0.70s ease-in-out;  
    -moz-transition: color 0.70s ease-in-out;  
    -webkit-transition: color 0.70s ease-in-out;  
    -o-transition: color 0.70s ease-in-out;  
}

.XMABAN a:hover span    {   
    color:#FFF0F5;  
    transition: color 0.25s ease-in-out;  
    -moz-transition: color 0.25s ease-in-out;  
    -webkit-transition: color 0.25s ease-in-out;  
    -o-transition: color 0.25s ease-in-out;  
}

HTML：

<tr>
    <td style="width: 33%;">
        <div class="XMABAN" style="margin: 10px 0px 5px 0px;">
            <a class="DSPI" href="online.asp">
                <img src="../images/PRM_220.jpg">
                <span>TEXT</span>
            </a>
        </div>
    </td>
</tr>

Answer 1

CSS过渡是not supported in IE9 or lower。但是，它们在IE10中受支持，并且您包含的CSS在IE10中可以正常工作。

我只能假设您正在使用IE10和IE9标准来测试这一点，这就是转换无效的原因。要更改此设置，只需将IE的文档模式设置为标准：

IE Demonstration

值得注意的是，您应始终在之前>包含供应商前缀预期的CSS属性。例如，在transition之前指定-webkit-transition将告诉基于WebKit的浏览器使用前缀版本而不是实际版本，并且每个处理方式可能存在差异。将您的CSS更改为：

-moz-transition: ...;
-webkit-transition: ...;
-o-transition: ...;
transition: ...;

CSS过渡不适用于IE

1 个答案: